.msar-shopping-list-controls {
	position: relative;
		top: -50px;
		/*left: 90%; */
		float: right;
		right: 35px;
		width: 10px;
		height: 10px;
	  text-align:right;
}

.msar-shopping-list-controls button {
  background: url('/wp-content/themes/buddyboss-theme-child/images/trash-512.png') no-repeat;
  background-size: 30px;
	display: inline-block;
	padding: 30px 0 0 0;
	height: 0;
	overflow: hidden;
  border:none;
  max-width:30px;
  /*position: relative;
top: -50px;*/
}


#msar-sl-delete-actions-modal .ui-dialog .ui-dialog-content  {
  display:block;
  border: solid 1px rgba(230, 230, 230, 0.72);
	padding: 30px 40px 40px;
	width: 80% !important;
	max-width: 400px;
	background-color: #FFF;
	border-radius: 8px;
	box-shadow: 0px 2px 5px rgba(210, 210, 210, 0.5);
}


.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons {
	display: block;
	border: solid 1px #e6e6e6;
	padding: 30px 60px 40px;
	width: 80% !important;
	max-width: 500px;
	background-color: #FFF;
	border-radius: 8px;

}

#msar-sl-delete-actions-modal {
	width: 100% !important;
	min-height: 0px;
	max-height: none;
	height: auto;
	display: inline-block;
	padding: 15px 0 10px;
  
  
}

button.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-icon-only.ui-dialog-titlebar-close {
	float: right;
}

button.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only {
	width: 100% !important;
	border: 2px solid #ddd;
	border-radius: 6px;
	color: #0281cc;
	padding: 5px;
}

button.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only:hover {
	width: 100% !important;
	border: 2px solid #0281cc;
	border-radius: 6px;
	color: #0281cc;
	padding: 5px;
}

button.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-icon-only.ui-dialog-titlebar-close {
	background: url(/wp-content/themes/buddyboss-theme-child/images/close.png) no-repeat;
	  background-size: 15px;
	background-position: right;
  border:none;
	  color: #9c9c9c;
	padding: 30px 0 0 0;
	height: 0;
	height: 0;
	overflow: hidden;
}

.msar-tabs {
	display: flex;
	margin-bottom: 10px;
}

.msar-tabs_add-recipes-modal {
	margin: -1rem 0rem 10px 0rem;
	flex-wrap: nowrap;
	border-bottom: none;
}

.msar-tabs__tab {
	flex: 1 1 0;
	min-width: 0;
	box-sizing: border-box;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;

	padding: 4px;
	cursor: pointer;
	border-radius: 100px;
	border: 1px #f6f6f6 solid;
	margin: 0 3px;
	background-color: #f6f6f6;
}

.msar-tabs__tab:not(:last-child) {
	/* border-right: 1px solid #dee2e6; */
}

.msar-tabs__tab_active {
	background-color: #007CFF;
	color: white;
	border-radius: 100px;
	border: 2px #007CFF solid;
}



.msar-tab {
	display: block;
	width: 50%;
	padding: 5px 10px 10px;
	text-align: center;
	font-weight:100;
	background: #f3F3F3;
}

.msar-tab.active {
}

.msar-tab-caption {
}



.msar-tab-content {
    display: none;
}

.msar-tab-content.active {
    display: block;
}



/* Categories tab content */
.msar-sl-category-wrapper {
}

.msar-sl-category-title {
	font-size:1.3em;
	  font-family: sans-serif;
	font-style: normal;
	font-weight: 700;
}

/* The <ul> list */
.msar-sl-category-ingredients {
}

/* Recipe tab content */
.msar-sl-recipe-wrapper {
}

.msar-sl-recipe-title {
	border-bottom: 1px solid #DDD;
	padding-left: 5px;
	padding-bottom: 4px;
}

.msar-sl-recipe-title > a {
}

/* The <ul> list */
.msar-sl-recipe-ingredients {
	margin-left: 5px;
}



.msar-recipe-ingredients-list-item {
	list-style:none;
}

.msar-recipe-ingredients-list-item.bought {
}

.msar-recipe-ingredients-list-item.bought .msar-recipe-ingredient-units,
.msar-recipe-ingredients-list-item.bought .msar-recipe-ingredient-name {
	text-decoration: line-through;
}



.msar-recipe-checkbox-wrapper {
	display: inline-block;	
	width:  20px;
	height: 20px;
	font-size: 0;
	border: 2px solid #ccc;
	border-radius: 2px;
	cursor: pointer;
	position: relative;
	margin-right: 5px;
}

/* The "disabled" class used to prevent multiple AJAX calls at the same time (on the same item in list) */
/* Also can be used to style <label> element and its siblings */
.msar-recipe-checkbox-wrapper.disabled {
}

/* This code hides default checkbox but we still need it */
.msar-recipe-checkbox-wrapper > .msar-sl-checkbox,
.msar-recipe-checkbox-wrapper > .msar-recipe-checkbox {
	position: absolute;
	left: -10000px;
	top:  -10000px;
	opacity: 0;
	visibility: hidden;
}

.msar-recipe-checkbox-mark {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: none;
}

.msar-recipe-checkbox-wrapper > .msar-sl-checkbox:checked + .msar-recipe-checkbox-mark,
.msar-recipe-checkbox-wrapper > .msar-recipe-checkbox:checked + .msar-recipe-checkbox-mark {
	display: block;
	background-color: #ccc;
}



.msar-sl-delete-action-button,
.msar-sl-cancel-del-modal-button {
	width: 100% !important;
	display: block;
	cursor: pointer;
	text-align: center;
	background-color: rgb(249, 104, 118) !important;
    padding: 10px 30px 10px;
    color: white !important;
    border-radius: 8px;
    border: 2px solid #f96876 !important;
}

.msar-sl-delete-action-button:hover, .msar-sl-cancel-del-modal-button:hover {
    background-color: #fff !important;
    border: 2px solid #f96876 !important;
    color: #f96876 !important;
	box-shadow:none;
}

.msar-sl-delete-action-button {
	margin-bottom: 10px;
}

.msar-sl-cancel-del-modal-button {
	margin-top: 20px;
}

#msar-sl-clear-checked-items-button {
	background-color: #fff !important;
    color: rgb(249, 104, 118) !important;
	box-shadow:none !important;
	padding: 8px 20px;
	font-size: 0.95em;
}

#msar-sl-clear-list-button {
	
}

button.ui-button.ui-corner-all.ui-widget {
    width: 100%;
    border: 2px solid #ddd;
    border-radius: 8px;
    padding: 8px 20px;
    color: #0281cc;
    background-color: #fff;
}

button.ui-button.ui-corner-all.ui-widget:hover {
	background-color:#fff !important;
	border-color:#0281cc;
	box-shadow:none;
}





/** Meal planner styles */

.msar-meal-planner-popup {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	background-color: white;
	z-index: 10000;
}

.msar-meal-planner-popup-header {
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.msar-meal-planner-popup-header__button {
}

.msar-meal-planner-popup-header__caption {
}

.msar-meal-planner-popup-tabs {
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}

.msar-meal-planner-popup-tabs__item {
	text-align: center;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
}

.msar-meal-planner-popup-tabs__item_active {
	/* TODO: REMOVE */
	background: red;
}

.msar-meal-planner-popup__loading-caption {
	width: 100%;
	padding: 20px 0;
	text-align: center;
}

.msar-meal-planner-popup-weeks-wrapper {
	width: 100%;
}

.msar-meal-planner-popup-week {
	display: none;
}

.msar-meal-planner-popup-week_active {
	display: block;
}

.msar-meal-planner-popup-week-day {
	margin-bottom: 10px;
}

.msar-meal-planner-popup-week-day-header {
	display: flex;
	width: 100%;
	border-bottom: 1px solid #dedede;
	align-items: center;
}

.msar-meal-planner-popup__checkbox {
	width:  30px;
	height: 30px;
	border: 2px solid grey;
	border-radius: 50%;
	position: relative;
	cursor: pointer;
	overflow: hidden;
	flex-shrink: 0;
	margin-right: 15px;
}

.msar-meal-planner-popup__checkbox-input {
	position: absolute;
	left: -10000px;
	top:  -10000px;
	opacity: 0;
	visibility: hidden;
}

.msar-meal-planner-popup__checkbox-mark {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: none;

	background-color: red; /** TODO: Remove; */
}

.msar-meal-planner-popup__checkbox-mark_checked {
	display: block;
}

.msar-meal-planner-popup-week-day-header__week-day-name {
	text-transform: uppercase;
}

.msar-meal-planner-popup-week-day-header__nutrients {
	display: block;
	font-size: 10px;
	line-height: 14px;
}

.msar-meal-planner-popup-week-day-header__toggler {
	width:  20px;
	height: 20px;
	cursor: pointer;
	flex-shrink: 0;
	margin-left: auto;

	background-color: red; /** TODO: */
}

.msar-meal-planner-popup-week-day-header__toggler_active {
	background-color: green; /** TODO: */
}


.msar-meal-planner-active-recipe {
	width: 100%;
	background-color: grey;
	margin-bottom: 10px;
}

.msar-meal-planner-active-recipe-header {
	display: flex;
	align-items: center;
	width: 100%;
}

.msar-meal-planner-active-recipe-header__image-wrapper {
	width: 40px;
	flex-shrink: 0;
    margin-right: 5px;
}

.msar-meal-planner-active-recipe-header__image {
	width: 100%;
	height: auto;
	display: block;
}

.msar-meal-planner-active-recipe__servings {
	margin: 5px 0;
	padding-left: 45px;
	display: flex;
	align-items: center;
	width: 100%;
	justify-content: space-between;
}

.msar-meal-planner-active-recipe__servings-caption {
	font-size: 14px;
}

.msar-meal-planner-active-recipe__servings-controls {
	display: flex;
}

.msar-meal-planner-active-recipe__servings-controls-button {
	width: 24px !important;
    height: 24px;
    line-height: 24px;
    border-radius: 50%;
    text-align: center;
    padding: 0;
    margin: 0 !important;
    flex-shrink: 0;
    border: none;
}

.msar-meal-planner-active-recipe__servings-controls-caption {
	margin: 0 10px;
}

.msar-meal-planner-active-recipe__nutrients {
	display: block;
	padding-left: 45px;
	font-size: 10px;
	line-height: 14px;
	text-align: left;
}


.msar-meal-planner-week-day-recipes {
	padding: 10px 0 0 10px;
}

.msar-meal-planner-week-day-recipes_hidden {
	display: none;
}

.msar-meal-planner-week-day-recipe {
	display: flex;
	width: 100%;
	align-items: center;
	padding-bottom: 10px;
}

.msar-meal-planner-week-day-recipe__thumbnail-wrapper {
	width: 50px;
	flex-shrink: 0;
    margin-right: 5px;
}

.msar-meal-planner-week-day-recipe__thumbnail {
	width: 100%;
	height: auto;
	display: block;
}

.msar-meal-planner-week-day-recipe__text {
}

.msar-meal-planner-week-day-recipe__title {
}

.msar-meal-planner-week-day-recipe__nutrients {
	display: block;
	font-size: 10px;
	line-height: 14px;
}







/** Meal planner page */

.msar-meal-planner-page {
	display: flex;
	flex-wrap: wrap;
}



.msar-meal-planner-page__loading-caption {
	width: 100%;
	padding: 20px 0;
	text-align: center;
}



.msar-meal-planner-page__edit-controls {
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	padding: 5px 10px;
	background-color: rgba(0, 0, 0, .6);
}

.msar-meal-planner-page__edit-controls_sticky {
	position: fixed;
	width:auto !important;
	bottom: 0;
	left:0;
	right:0;
}

.msar-meal-plan-details-page {
	margin-bottom:40px;
}


.msar-meal-planner-page-header {
	width: 100%;
	display: flex;
	justify-content: space-between; /** TODO */
	margin-bottom: 10px;
}

.msar-meal-planner-page-header__controls {
	display: flex;
	align-items: center;
}

.msar-meal-planner-page-header__controls > button:not(:last-child) {
	margin-right: 10px;
}

.msar-meal-planner-page-header__button {
}



.msar-meal-planner-page-header__caption {
	display: flex;
	align-items: center;
}



.msar-meal-planner-page-tabs {
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}

.msar-meal-planner-page-tabs__item {
	text-align: center;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
}

.msar-meal-planner-page-tabs__item_active {
	/* TODO: REMOVE */
	background: red;
}



.msar-meal-planner-page-weeks-wrapper {
	width: 100%;
}

.msar-meal-planner-page-week {
	display: none;
}

.msar-meal-planner-page-week_active {
	display: block;
}

.msar-meal-planner-page-week__avg-cals {
	background-color: #dedede;
	text-align: center;
	padding: 5px 10px;
}



.msar-meal-planner-page-week-day {
	margin-bottom: 10px;
}

.msar-meal-planner-page-week-day-header {
	display: flex;
	width: 100%;
	border-bottom: 1px solid #dedede;
	align-items: center;
}

.msar-meal-planner-page__checkbox {
	width:  30px;
	height: 30px;
	border: 2px solid grey;
	border-radius: 50%;
	position: relative;
	cursor: pointer;
	overflow: hidden;
	flex-shrink: 0;
	margin-right: 15px;
}

.msar-meal-planner-page__checkbox-mark {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: none;

	background-color: red; /** TODO: Remove; */
}

.msar-meal-planner-page__checkbox-mark_checked {
	display: block;
}

.msar-meal-planner-page-week-day-header__week-day-name {
	text-transform: uppercase;
}

.msar-meal-planner-page-week-day-header__nutrients {
	display: block;
	font-size: 10px;
	line-height: 14px;
}

.msar-meal-planner-page-week-day-header__help-text {
	font-size: 10px;
	line-height: 14px;
}

.msar-meal-planner-page__day-controls {
	margin-left: auto;
	flex-shrink: 0;
}

.msar-meal-planner-page__add-to-shopping-list-button {
}

.msar-meal-planner-page__add-new-recipe-button {
}



.msar-meal-planner-page-week-day-recipes {
	padding-top: 10px;
}

.msar-meal-planner-page-week-day-recipes-wrapper {
	height:38vh;
}



.msar-meal-planner-page-week-day-recipe {
	display: flex;
	width: 100%;
	align-items: center;
	padding-bottom: 10px;
}

.msar-meal-planner-page-week-day-recipe__thumbnail-wrapper {
	width: 50px;
	flex-shrink: 0;
    margin-right: 5px;
}

.msar-meal-planner-page-week-day-recipe__thumbnail {
	width: 100%;
	height: auto;
	display: block;
}

.msar-meal-planner-page-week-day-recipe__text {
}

.msar-meal-planner-page-week-day-recipe__title {
}

.msar-meal-planner-page-week-day-recipe__nutrients {
	display: block;
	font-size: 10px;
	line-height: 14px;
}

.msar-meal-planner-page-week-day-recipe__servings {
	margin-left: auto;
	flex-shrink: 0;
}



.msar-meal-planner-page-edit-modal {
	flex-wrap: wrap;
}

.msar-meal-planner-page-edit-modal__text {
	width: 100%;
	text-align: center;
}

.msar-meal-planner-page-edit-modal__days-list {
	width: 100%;
	margin-bottom: 10px;
}

.msar-meal-planner-page-edit-modal__day {
	display: flex;
	width: 100%;
	padding: 15px 0;
	border-bottom: 1px solid #dedede;
	justify-content: space-between;
	cursor: pointer;
}

.msar-meal-planner-page-edit-modal__buttons {
    display: flex;
    justify-content: center;
    gap: 10px !important;
}

.msar-meal-planner-page-edit-modal__buttons button {
    width: auto !important;
    flex: 0 0 auto !important;
    margin: 20px 0 !important;
}

.msar-meal-planner-page-edit-modal__day-title {
}

.msar-meal-planner-page-edit-modal__mark {
}

.msar-mp-add-recipes-modal-search-form {
	display: flex;
}

.msar-mp-add-recipes-modal-recipe-servings-control {
	margin-left: auto;
}

.msar-mp-add-recipes-modal-recipe-servings-control__decrease,
.msar-mp-add-recipes-modal-recipe-servings-control__increase {
	width:  24px;
	height: 24px;
/*	line-height: 24px;*/
	display: inline-block;
	border-radius: 50%;
	background-color: #57ad68;
	color: white;
	cursor: pointer;
	text-align: center;
	padding:0;
}

.msar-mp-add-recipes-modal-recipe-servings-control__decrease {
}

.msar-mp-add-recipes-modal-recipe-servings-control__servings {
	margin: 0 5px;
}

.msar-mp-add-recipes-modal-recipe-servings-control__increase {
}





.modal-open {
  overflow: hidden;
}

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1050;
  display: none;
  width: 100%;
  height: 100%;
  overflow: hidden;
  outline: 0;
}

.modal-dialog {
  position: relative;
  width: auto;
  margin: 0.5rem;
  pointer-events: none;
}

.modal.fade .modal-dialog {
  transition: transform 0.3s ease-out;
  transform: translate(0, -50px);
}

@media (prefers-reduced-motion: reduce) {
  .modal.fade .modal-dialog {
    transition: none;
  }
}

.modal.show {
	display: block;
}

.modal.show .modal-dialog {
  transform: none;
}

.modal.modal-static .modal-dialog {
  transform: scale(1.02);
}

.modal-dialog-scrollable {
  display: flex;
  max-height: calc(100% - 1rem);
}

.modal-dialog-scrollable .modal-content {
  max-height: calc(100vh - 1rem);
  overflow: hidden;
}

.modal-dialog-scrollable .modal-header,
.modal-dialog-scrollable .modal-footer {
  flex-shrink: 0;
}

.modal-dialog-scrollable .modal-body {
  overflow-y: auto;
}

.modal-dialog-centered {
  display: flex;
  align-items: center;
  min-height: calc(100% - 1rem);
}

.modal-dialog-centered::before {
  display: block;
  height: calc(100vh - 1rem);
  content: "";
}

.modal-dialog-centered.modal-dialog-scrollable {
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

.modal-dialog-centered.modal-dialog-scrollable .modal-content {
  max-height: 54vh;
}

.modal-dialog-centered.modal-dialog-scrollable::before {
  content: none;
}

.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.3rem;
  outline: 0;
}

.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1040;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, .5);
  display: none;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop.show {
	display: block;
}

.modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 1rem 1rem;
  margin-bottom:0;
  border-bottom: 1px solid #dee2e6;
  border-top-left-radius: calc(0.3rem - 1px);
  border-top-right-radius: calc(0.3rem - 1px);
}

.modal-header .close {
  padding: 1rem 1rem;
  margin: -1rem -1rem -1rem auto;
  border:none;
}

.modal-title {
  margin-bottom: 0;
  line-height: 1.5;
}

.modal-body {
  position: relative;
  flex: 1 1 auto;
  padding: 1rem;
  scrollbar-width: none;
  scrollbar-gutter: auto;
  justify-content: center;
  margin-top: 10px;
}

.modal-body form {
margin-bottom: 0
}

.modal-content .modal-body > button[type="button"] {
background-color: #007CFF;

margin-bottom: 30px;

}
.modal-body input[type="text"],
.modal-body button[type="button"] {
display: block;
width: 80%;                /* ou 300px, ou 100% selon ce que tu préfères */
margin: 0 auto 12px auto;  /* centré horizontalement + marge en bas */
box-sizing: border-box;
}

.modal-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding: 0 0 10px;
  border-top: none;
  border-bottom-right-radius: calc(0.3rem - 1px);
  border-bottom-left-radius: calc(0.3rem - 1px);
  margin-top: 0px;
  margin-bottom: 30px;
}

.modal-footer > * {
  margin: 0.25rem;
}

.modal-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}

@media (min-width: 576px) {
  .modal-dialog {
    max-width: 500px;
    margin: 1.75rem auto;
  }
  .modal-dialog-scrollable {
    max-height: calc(100% - 3.5rem);
  }
  .modal-dialog-scrollable .modal-content {
    max-height: calc(100vh - 3.5rem);
  }
  .modal-dialog-centered {
    min-height: calc(100% - 3.5rem);
  }
  .modal-dialog-centered::before {
    height: calc(100vh - 3.5rem);
  }
  .modal-sm {
    max-width: 300px;
  }
}

@media (min-width: 782px) {
	body.admin-bar .modal-dialog-scrollable {
		max-height: calc(100% - 1.75rem - 42px);
	}

	body.admin-bar .modal-dialog-scrollable .modal-content {
		max-height: calc(100vh - 1.75rem - 42px);
	}

	body.admin-bar .modal-dialog-centered {
		min-height: calc(100% - 1.75rem - 42px);
	}

	body.admin-bar .modal-dialog-centered::before {
		height: calc(100vh - 1.75rem - 42px);
	}
}

@media (min-width: 992px) {
  .modal-lg,
  .modal-xl {
    max-width: 800px;
  }
}

@media (min-width: 1200px) {
  .modal-xl {
    max-width: 1140px;
  }
	.msar-meal-planner-page__edit-controls_sticky {
		left:calc((100vw - 1180px)/2);
		right:calc((100vw - 1180px)/2);
	}
}

body.admin-bar .modal-dialog {
	margin-top: 42px;
}

@media screen and (max-width: 589px) {
	.msar-grid-favorites-button {
		width: 25px;
		height: 25px;
		padding-bottom: 2px;
	}

	.msar-grid-favorites-button::after {
		font-size: 18px;
	}
}

@media screen and (max-width: 782px) {
	body.admin-bar .modal-dialog {
		margin-top: 56px;
	}

	body.admin-bar .modal-dialog-scrollable {
		max-height: calc(100% - 1.75rem - 56px);
	}
	
	body.admin-bar .modal-dialog-scrollable .modal-content {
		max-height: calc(100vh - 1.75rem - 56px);
	}

	body.admin-bar .modal-dialog-centered {
		min-height: calc(100% - 1.75rem - 56px);
	}

	body.admin-bar .modal-dialog-centered::before {
		height: calc(100vh - 1.75rem - 56px);
	}

	.msar-favorites-slide {
		width: 120px !important;
		margin: 0 5px;
		font-size: 0.95em;
	}

	[aria-label="Favorite recipes slider"] .msar-favorites-last-slide {
		height:120px !important;
	}

	
	[aria-label="Meal plans slider"] .msar-favorites-last-slide {
    height:70px !important;
	}
	
	.msar-favorites-slide__images {
		height: 70px !important;
	}

	.msar-favorites-slide__main-image {
		width: 75px !important;
	}
	.msar-favorites-slide__side-image {
		width: 41px;
	}
	.msar-favorites-slide__images_square {
	    height: 120px !important;
	}	
	
	.msar-favorites-slide__content a {
		padding: 0 0 0 0 !important;
	}
	
	.msar-favorites-slide__images_square div {
	    width: 58px !important;
	    height: 58px !important;
	  }

	
	.msar-meal-plans-list-item-thumbnail {
		width: 120px !important;
		height: 70px !important;
	}
	
	.msar-meal-plans-list-item-thumbnail div {
		width: 75px !important;
	}

	.msar-meal-plans-list-item-thumbnail__side-images div {
		height:70px !important;
	}
	
	.msar-meal-plans-list-item-thumbnail__side-image {
    width: 41px !important;
    height: auto !important;
  }

	.msar-favorites-list-item__caption {
		line-height: 1.1em !important;
	}
	.msar-favorites-list-item__caption a {
	    font-size: 0.95em !important;
	    padding: 0px !important;

	 }
	.msar-recipe-thumbnail {
		width:70px !important;
		height:70px !important;
	}
	.msar-recipes-list-item-content__text-column {
		line-height:1.3em;
		font-size:0.95em;
	}
	.modal-dialog-centered.modal-dialog-scrollable .modal-content {
		max-height: 76vh !important;
	}

	.msar-tabs_add-recipes-modal {
		margin: -0.5rem 0rem 10px 0rem !important;
	}

	.msar-collections-list-item-thumbnail.msar-collections-list-item-thumbnail_small {
		width:68px !important;
		height:68px !important;
		gap: 2px;
	}

	.msar-collections-list-item-thumbnail.msar-collections-list-item-thumbnail_small > div {
		width: 33px !important;
		height: 33px !important;
	}

	.msar-collections-list-item {
		line-height:1.6em;
		font-size:0.8em;
	}

	

	.msar-meal-planner-page-header__button.msar-meal-planner-page-header__button_type_custom-menus {

    padding: 3px 5px !important;
    font-size:12px !important;
	}



	.msar-button_back, .msar-button_add {
	font-size: 18px !important;
	}

	.msar-button_back, .msar-button_add {
	width: 28px!important;
	height: 28px !important;
	}

	.msar-favorites-page-header h1, .msar-favorites-page-header h2 {
	font-size: 1.3em !important;
	}

	
	.msar-add-recipes-modal-collections-wrapper{
	height:54vh !important;
	}
	.msar-meal-planner-page-week-day-recipes-wrapper {
		height:45vh;
	}

	.msar-meal-plan-details-page .msar-favorites-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.5rem;
	}

	 .msar-favorites-page-header__left {
	    display: flex;
	    align-items: center;
	    flex: 1 1 auto;
	    min-width: 0;
	}

	.msar-favorites-page-header h1 {
		 white-space: normal !important;
	    display: -webkit-box;
	    -webkit-line-clamp: 2;
	    -webkit-box-orient: vertical;
	    overflow:hidden;
	    text-overflow: ellipsis;
	    line-height: 1.3;
	    word-wrap: break-word;
	    font-size: clamp(1.25rem, 3vw, 1.75rem);
	    margin: 0;
		align-self:flex-start;
	}
	
	.msar-meal-plan-details-page .msar-favorites-page-header h2 {
	    display: -webkit-box;
	    -webkit-line-clamp: 1;
	    -webkit-box-orient: vertical;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    line-height: 1.3;
	    word-wrap: break-word;
	    font-size: clamp(1.25rem, 3vw, 1.75rem);
	    margin: 0;
	}
	
	.msar-meal-plan-details-page .msar-favorites-page-header__right {
	    display: flex;
	    gap: 0rem;	 
	    flex: 0 0 auto;
	    margin:0 auto;
	}

	
	/*END*/
}

@media screen and (min-width: 782px) and (max-width: 1200px) {
		.modal-dialog-centered.modal-dialog-scrollable .modal-content {
		max-height: 85vh !important;
	}

	
}



/** "This Week", "Next Week" buttons on "Add to shopping list" modal */
.msar-toggle-week__button {
	width: 200px !important;
	height: 45px;
	border-radius: 25px;
	display: block;
	/*margin: 20px auto 15px auto !important; */
	justify-content: center;
}

.msar-meal-plan-week-day__button-list {
	text-align: center;
	display: flex;
	justify-content: center;
	margin-bottom: 50px;
}

/** General Add to shopping list modal's button */
.msar-atsl-modal__button {
	border: 3px solid grey;
	text-align: center;
	padding: 0;
	background-color: white;
	color: grey;
}

.msar-atsl-modal__button:hover,
.msar-atsl-modal__button:focus {
	transition: none;
	box-shadow: none;
	background: white;
	color: grey;
	border-color:#02b573;
}

.msar-atsl-modal__button_checked {
	border-color: green;
	background-color: green;
	color: white;
}

.msar-atsl-modal__button_checked:hover,
.msar-atsl-modal__button_checked:focus {
	background: green;
}

.msar-meal-plan-week-day__button {
	width: 50px !important;
	height: 50px !important;
	border-radius: 50% !important;
	margin: 0 5px !important;
}

/** Has recipes in shopping list */
.msar-meal-plan-week-day__button_hrisl {
	border: 3px solid green;
	color: green;
}

.msar-meal-plan-week-day__button_day-was-modified {
	border: 3px dashed green;
	color: green;
}

h5.modal-title {
	margin-top: 0 !important;
}

.msar-atsl-modal__footer-wrapper {
	text-align: center;
}

.msar-atsl-modal__footer-checkbox-wrapper {
	margin-bottom: 10px;
}

.msar-atsl-modal__submit-button {
	border-color: #57ad68;
	background-color: #57ad68;
	color: white;
}

.msar-mp-modal__button {
	min-height: 2.65em;
	cursor: pointer;
	padding: 5px 20px;
	text-align: center;
	border-radius: 8px;
	border-width: 1px;
	border-style: solid;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}

.msar-mp-modal__button_green {
	border-color: #57ad68;
	background-color: #57ad68;
	color: white;
}

button.msar-mp-modal__button.msar-mp-modal__button_green {
		
	background-color: #02b573;
}

.msar-cmp-modal-content {
margin: 10px 0 40px;
}

.msar-cmp-modal-content .msar-mp-modal__button.msar-mp-modal__button_green {
	background-color: rgb(249, 104, 118) !important;
	border: 2px solid rgb(249, 104, 118);
}
.msar-cmp-modal-content .msar-mp-modal__button.msar-mp-modal__button_green:hover {
	color: rgb(249, 104, 118) !important;
	background-color:#FFF !important;

}


.msar-mp-modal__button_green:hover {
	background-color: white;
	color: #57ad68;
}

.msar-mp-modal__button_grey {
	/* margin-left: auto; */
	font-weight: normal;
	background-color: white;
	border: 2px solid #ddd;
	border-radius: 6px;
	color: #0281cc;
	margin-top: 30px !important;
}

.msar-mp-modal__button_grey:hover {
	background-color: white;
	border: 2px solid #0281cc;
   color: #0281cc;
   box-shadow:none;
  
}

.msar-mp-add-recipes-modal__button,
.msar-mp-copy-modal__button {
	height: 2.65em;
	cursor: pointer;
	padding: 5px 20px;
	background-color: #57ad68;
	color: white;
	text-align: center;
	border-radius: 8px;
	border: 1px solid #57ad68;
}

.msar-mp-add-recipes-modal__button {
	display: inline-flex;
	padding:10px 80px 10px;
	margin:0 auto 20px;
	font-size:16px;
}

.msar-mp-add-recipes-modal__search-button {
	margin: 0 0 9px 20px;
}

.msar-mp-add-recipes-modal-search-form button {
cursor: pointer;
padding: 1px 20px 3px;
margin: 0 0px 10px 10px !important;
width: 200px !important;
background-color: #02b573 !important;
color: white;
text-align: center;
border-radius: 8px;
display: block;
border: 2px solid #02b573;
height: 40px;
}

.msar-mp-add-recipes-modal__button-load-more {
	margin-left: 0 !important;
	font-weight: normal;
	background-color: white !important;
	border: 2px solid #ddd !important;
	border-radius: 6px;
	color: #0281cc !important;
	width: 120px !important;
}

.msar-mp-add-recipes-modal__button-add-new-recipes {
	margin: 0 auto;
	display: block !important;
	width: 150px;
	background-color: #02b573 !important;
	font-weight:bold;
}

button.msar-mp-modal__button.msar-mp-modal__button_green:disabled {
    background-color: #E1E1E1 !important;
    border: none;
    font-weight: bold;
}

.msar-mp-add-recipes-modal__button-add-new-recipes:disabled {
background-color: #E1E1E1 !important;
border: none;
}

.msar-mp-add-recipes-modal__footer {
	width: 100%;
	display: flex;	
	justify-content: space-between;
}

.msar-cmp-modal-content .msar-mp-modal__button {
	display: flex;
	margin: 0 auto 10px auto;
}

.msar-cmp-modal-content .msar-mp-modal__button msar-mp-modal__button_green {
	background-color:red !important;
	
}


.msar-add-recipe-to-favorites-button {
	background-color: white;
	border-radius: 5px;
	border: 3px solid #f85464;
	cursor: pointer;
	padding: 10px 15px;
	outline: none;
	transition: border-color 200ms ease-in-out, background-color 200ms ease-in-out;
}

.msar-add-recipe-to-favorites-button:active,
.msar-add-recipe-to-favorites-button:hover {
	box-shadow: none;
}

.msar-animated-background-stripes {
	background-image: linear-gradient(
		45deg,
		rgba(255, 255, 255, .25) 25%,
		transparent 25%,
		50%,
		rgba(255, 255, 255, .25) 50%,
		rgba(255, 255, 255, .25) 75%,
		transparent 75%,
		transparent
	);
	background-size: 1.25rem 1.25rem;
	animation: .5s linear infinite progress-bar-stripes;
}
.msar-animated-background-stripes_pink {
	background-image: linear-gradient(
			45deg,
			rgba(237, 120, 131, 0.25) 25%,
			transparent 25%,
			50%,
			rgba(237, 120, 131, 0.25) 50%,
			rgba(237, 120, 131, 0.25) 75%,
			transparent 75%,
			transparent
	);
	background-size: 1.25rem 1.25rem;
	animation: .5s linear infinite progress-bar-stripes;
}

@keyframes progress-bar-stripes {
	0% {
		background-position-x: 0;
	}
	100% {
		background-position-x: 1.25rem;
	}
}

.msar-add-recipe-to-favorites-button.msar-add-recipe-to-favorites-button_in-progress {
	cursor: wait !important;
	border-color: transparent;
	/*background-color: #fb9da6;*/
}

.msar-add-recipe-to-favorites-button:not(.msar-add-recipe-to-favorites-button_in-progress):hover {
	border-color: #dd112b;
}

.msar-add-recipe-to-favorites-button:not(.msar-add-recipe-to-favorites-button_in-progress):hover .msar-add-recipe-to-favorites-button__caption {
	color: #dd112b;
}

.msar-add-recipe-to-favorites-button.msar-add-recipe-to-favorites-button_active {
	background-color: #f85464;
	border-color: transparent;
}

.msar-add-recipe-to-favorites-button__caption {
	color: #f85464;
	font-weight: bold;
	transition: color 200ms ease-in-out;
}

.msar-add-recipe-to-favorites-button.msar-add-recipe-to-favorites-button_active:not(.msar-add-recipe-to-favorites-button_in-progress):hover {
	background-color: #fb7584;
	border-color: transparent;
}

.msar-add-recipe-to-favorites-button.msar-add-recipe-to-favorites-button_active .msar-add-recipe-to-favorites-button__caption,
.msar-add-recipe-to-favorites-button.msar-add-recipe-to-favorites-button_active:hover .msar-add-recipe-to-favorites-button__caption {
	color: white;
}



.msar-favorites-page-section {
	width: 100%;
	padding-bottom: 35px;
}

.msar-favorites-page-section-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.msar-favorites-page-section-header__text {
	margin-bottom: 15px;
}

.msar-favorites-page-section-header__view-all-link {
	color: #A3A5A9;
}

#msar-meal-plans-slider,
#msar-recipes-slider {
	margin-left: -5px;
}


.msar-favorites-last-slide {
	width: 240px;
	height: 140px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.msar-favorites-slide {
	width: 240px;
	margin: 0 5px;
}

[aria-label="Favorite recipes slider"] .msar-favorites-last-slide {
		height:240px;
	}

a.msar-favorites-last-slide span {
color: #A3A5A9;
}


.msar-favorites-slide__preloader {
	width: 100%;
	height: 140px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.msar-favorites-slide__images {
	height: 140px;
	overflow: hidden;
	border-radius: 7px;
	margin-bottom: 10px;
	display: flex;
	flex-wrap: nowrap;
	column-gap: 4px;
    position: relative;
}

.msar-img-stub {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgb(238, 238, 238);
}

.msar-img-stub.msar-favorites-slide__side-image {
    position: relative !important;
}

.msar-favorites-slide__images_square {
	height: 240px;
	flex-wrap: wrap;
	gap: 4px;
}

.msar-favorites-slide__images_square img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.msar-favorites-slide__images_square > div {
	width: 118px;
	height: 118px;
	overflow: hidden;
    position: relative;
}

a.msar-favorites-slide__images,
a.msar-favorites-slide__images:focus,
a.msar-favorites-slide__images:active {
	outline: none !important;
	text-decoration: none!important;
	/* width: 120px; */
}

.msar-favorites-slide__main-image {
	width: 150px;
	flex-shrink: 0;
    position: relative;
}

.msar-favorites-slide__side-images {
	display: flex;
	flex-shrink: 0;
	flex-grow: 1;
	flex-direction: column;
	row-gap: 4px;
	justify-content: space-between;
}

.msar-favorites-slide__side-image {
	flex-grow: 1;
	flex-shrink: 0;
}

.msar-favorites-slide__images_grid {
	display: grid;
	grid-template-columns: 5fr 3fr;
	grid-template-rows: 1fr 1fr;
	gap: 5px 5px;
}

.msar-favorites-slide__images_grid > div {
	background-color: red;
}

.msar-favorites-slide__images_grid > div > img {
	/*width: 100%;*/
	/*height: 100%;*/
}

.msar-favorites-slide__images-grid-main-item {
	grid-column: 1 / 2;
	grid-row: 1 / span 2;
}

.msar-favorites-slide__content {
}

.msar-favorites-slide__content a {
color: rgb(77, 92, 109);
font-weight: bold;
line-height: 1.4;
padding-top: 10px;
display: block;
padding: 5px 10px 0px 5px;
}

.msar-favorites-nothing-found {
	display: flex;
	width: 100%;
	height: 180px;
	justify-content: center;
	align-items: center;
}


.msar-collections-list-page {
}

.msar-collections-list-header {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.msar-collections-list {
}

#msar-new-collection-name-input {
display: inline-block;
width: 50%;
}

.msar-add-button {
	box-sizing: border-box;
	width: 30px;
	height: 30px;
	border: 2px solid black;
	border-radius: 50%;
	background-color: transparent;
	font-size: 0;
	cursor: pointer;
	position: relative;
}

.msar-add-button::before,
.msar-add-button::after {
	content: '';
	display: block;
	background-color: black;
	position: absolute;
}

.msar-add-button::before {
	width: 14px;
	height: 2px;
	top: 12px;
	left: 6px;
}

.msar-add-button::after {
	width: 2px;
	height: 14px;
	top: 6px;
	left: 12px;
}



.msar-collections-list-item-thumbnail {
	width: 240px;
	height: 240px;
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	overflow: hidden;
	border-radius: 7px;
	outline: none !important;
	text-decoration: none !important;
	flex-shrink: 0;
}

.msar-collections-list-item-thumbnail > div {
	width: 118px;
	height: 118px;
	overflow: hidden;
    position: relative;
}

.msar-collections-list-item-thumbnail.msar-collections-list-item-thumbnail_small {
	width: 160px;
	height: 160px;
	border-radius: 4px;
}

.msar-collections-list-item-thumbnail.msar-collections-list-item-thumbnail_small > div {
	width: 78px;
	height: 78px;
}


.msar-collections-list-item {
	display: flex;
	width: 100%;
	margin-bottom: 15px;
	justify-content: space-between;
}

.msar-collections-list-item__content-column {
	display: flex;
	align-items: center;
}

.msar-collections-list-item__content-column-caption {
	margin-left: 10px;
}

.msar-collections-list-item__content-column-caption a {
color: rgb(77, 92, 109);
font-weight: bold;
font-size: 1.2em;
}

.msar-recipes-list-item-content__text-column a {
	color: rgb(77, 92, 109);
}

.msar-collections-list-item__actions-column {
	display: flex;
	align-items: center;
}

.msar-collections-list-item__actions-column > button:not(:last-child) {
	margin-right: 5px;
}


.msar-load-more-button {
	/*width: 100%;*/
	width: 400px;
	height: 60px;
	display: flex;
	justify-content: space-around;
	align-items: center;
	cursor: pointer;
	background-color: transparent;
	box-sizing: border-box;
	border: 3px solid #79fba2;
	border-radius: 10px;
	outline: none;
	padding: 0;
}

.msar-load-more-button_active {
	animation: 200ms ease-in-out 0s 1 normal forwards running msar-load-more-button-animation;
	/*width: 60px;*/
	/*border-radius: 50%;*/
	font-size: 0;

	position: relative;
}

.msar-load-more-button_active:before,
.msar-load-more-button_active:after {
	display: block;
	content: '';
	position: absolute;
	animation: 1s linear 200ms infinite normal none running msar-load-more-button-progress-animation;
}

.msar-load-more-button_active:before {
	top: -3px;
	bottom: -3px;
	width: 3px;
	border-top: 3px solid red;
	border-bottom: 3px solid red;
}

.msar-load-more-button_active:after {
	left: -3px;
	right: -3px;
	height: 3px;
	border-left: 3px solid red;
	border-right: 3px solid red;
}

@keyframes msar-load-more-button-animation {
	to {
		width: 60px;
		border-radius: 50%;
	}
}

@keyframes msar-load-more-button-progress-animation {
	to {
		transform: rotate(1turn);
	}
}


.msar-favorites-list {
}

.msar-favorites-list-item {
	display: flex;
	width: 100%;
	margin-bottom: 15px;
	justify-content: space-between;
}

.msar-favorites-list-item__content-column {
	display: flex;
	align-items: center;
}

.msar-favorites-list-item__caption {
	margin-left: 10px;
}

.msar-favorites-list-item__caption a {
color: rgb(77, 92, 109);
font-weight: bold;
font-size: 1.2em;
padding-left: 10px;
}

.msar-favorites-list-item__actions-column {
	display: flex;
	align-items: center;
}

.msar-favorites-list-item__actions-column > button:not(:last-child) {
	margin-right: 5px;
}


.msar-meal-plans-list-item-thumbnail {
	width: 240px;
	height: 140px;
	overflow: hidden;
	border-radius: 7px;
	margin-bottom: 10px;
	display: flex;
	flex-wrap: nowrap;
	column-gap: 4px;
}

.msar-meal-plans-list-item-thumbnail__main-image {
	width: 150px;
	flex-shrink: 0;
    position: relative;
}

.msar-meal-plans-list-item-thumbnail__side-images {
	display: flex;
	flex-shrink: 0;
	flex-grow: 1;
	flex-direction: column;
	row-gap: 4px;
	justify-content: space-between;
}

.msar-meal-plans-list-item-thumbnail__side-image {
	flex-grow: 1;
	flex-shrink: 0;
    position: relative;
}



.msar-recipes-list {
}

.msar-recipes-list .msar-recipes-list-item {
	margin-bottom: 10px
}

.msar-recipes-list-item {
	display: flex;
	justify-content: space-between;
}

.msar-recipes-list-item .msar-recipes-list-item-content {
	margin-right: 10px;
}

.msar-recipes-list-item-content {
	display: flex;
	flex-wrap: nowrap;
	align-items:center;
}

.msar-remove-recipe-from-current-collection-checkbox-wrapper {
justify-content: center;
display: flex;
align-items: center;
margin-top: 40px;
}

.msar-move-button-wrapper {
display: flex;
justify-content: center;

margin-bottom: 30px;
margin-top: 10px;
}

#msar-remove-recipe-from-current-collection-checkbox {
margin-right: 4px;

}

label[for="create-new-collection-checkbox"] {
margin-left:4px;
margin-right:10px
}

.msar-recipes-list-item-content .msar-recipe-thumbnail {
	margin-right: 10px;
}

.msar-recipe-thumbnail {
	display: block;
	width: 118px;
	height: 118px;
	overflow: hidden;
	border-radius: 7px;
	flex-shrink: 0;
    position: relative;
}

.msar-recipes-list-item-content__text-column {
	max-width: 300px;
}

.msar-recipes-list-item-actions {
	display: flex;
	align-items: center;
}

.msar-recipes-list-item-actions > button:not(:last-child) {
	margin-right: 5px;
}


.v-collapse-content:not(.v-collapse-content-end) {
	display: none;
}

.msar-add-recipes-modal-collections-wrapper {
	margin: 0 -0.5rem -0.5rem -0.5rem;
	overflow: auto; /** Prevents scrolls on chevron animation */
	height: 38vh;
}

.msar-add-recipes-modal-collections-wrapper .vc-collapse:last-child .msar-collection-toggler {
	margin-bottom: 0;
	border-bottom: none;
}

.msar-add-recipes-modal-collections-wrapper .vc-collapse:last-child .msar-collection-collapse-content {
	margin-bottom: 0;
	border-bottom: none;
	border-top: 1px solid #dee2e6;
	padding-top: 10px;
}

.msar-collection-toggler {
	padding: 0 1rem 10px 1rem;
	margin-bottom: 10px;
	border-bottom: 1px solid #dee2e6;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.msar-collection-toggler .msar-chevron {
	margin-right: -8px;
	transition: transform 0.2s ease-in-out;
}

.msar-collection-toggler:has(+ .v-collapse-content-end) .msar-chevron {
	transform: rotate(180deg);
}

.msar-collection-collapse-content {
	padding: 0 1rem;
	border-bottom: 1px solid #dee2e6;
	margin-bottom: 10px;
}


.msar-drag-handle {
    width: 35px;
    height: 35px;
    cursor: grab;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #3c3c3c;
    font-family: 'Material Symbols Outlined', sans-serif;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
    font-size: 24px;
    line-height: 1;
}

.msar-drag-handle::before {
    content: '\e25d';
}

.sortable-chosen .msar-drag-handle {
    cursor: grabbing !important;
}


.msar-button {
	width: 35px;
	height: 35px;
	padding: 0;
	border: none;
	background-color: transparent;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	flex-shrink: 0;
	color: #3c3c3c;
}

.msar-button_round {
	border-radius: 50%;
}

.msar-button_bordered {
	border: 2px solid black;
}

.msar-button_bordered:hover {
	border: 2px solid black;
}

.msar-button_icon {
	font-family: 'Material Symbols Outlined', sans-serif;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
	font-size: 24px;
	line-height: 1;
}

.msar-button_delete {
}
.msar-button_delete::before {
	content: '\e872';
}

.msar-delete-confirmation-modal-delete-button {
background-color: rgb(249, 104, 118);
border:2px solid rgb(249, 104, 118);
}

.msar-delete-confirmation-modal-delete-button:hover {
border: 2px solid rgb(249, 104, 118);
background-color: #fff;
color: rgb(249,104,118);
}

button.msar-button:hover,button.msar-meal-planner-page__add-new-recipe-button:hover {
	background-color: rgba(0, 0, 0, .1);
}

.msar-button_back {
}
.msar-button_back::before {
	content: '\e5c4';
}

.msar-button_add {
}
.msar-button_add::before {
	content: '\e145';
}

.msar-button_edit {
}
.msar-button_edit::before {
	content: '\e3c9';
}

.msar-button_add-to-menu {
}
.msar-button_add-to-menu::before {
	content: '\f848';
}

.msar-button_print {
}
.msar-button_print::before {
	content: '\e8ad';
}

.msar-button_settings {
}
.msar-button_settings::before {
	content: '\e8b8';
}

.msar-button_close {
}
.msar-button_close::before {
	content: '\e5cd';
}

.msar-button_move {
}
.msar-button_move::before {
	content: '\f715';
}

.msar-button_save {
}
.msar-button_save::before {
	content: '\e161';
}



.msar-favorites-page-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: nowrap;
	margin-bottom: 15px;
}

.msar-favorites-page-header h1,
.msar-favorites-page-header h2 {
	margin: 0;
	font-size: 24px;
	font-weight: bold;
}

.msar-favorites-page-header__left {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	white-space: nowrap;
}

.msar-favorites-page-header__right {
}

.msar-favorites-page-header__right > button:not(:last-child) {
	margin-right: 5px;
}

.msar-favorites-page-header .msar-button_back {
	margin-right: 10px;
}



.msar-chevron {
	width: 34px;
	height: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #3c3c3c;
	font-family: 'Material Symbols Outlined', sans-serif;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
	font-size: 34px;
	line-height: 1;
}

.msar-chevron::before {
	content: '\e313';
}


.msar-add-recipe-to-meal-plan-modal .modal-body {
	padding: 0 !important;
}



.msar-hide {
	display: none;
}

body > .msar-printable-element {
	display: none;
}

@media print {
	.msar-no-print {
		display: none;
	}

	.msar-print {
		display: block; !important;
	}

	.msar-print-inline {
		display: inline-block; !important;
	}

	body.msar-body-hidden-on-print > *:not(.msar-printable-element) {
		display: none;
	}

	body.msar-body-hidden-on-print > .msar-printable-element {
		margin: 20px;
		display: block !important;
	}

	/* TODO: investigate break-inside property */

	.msar-meal-planner-page-weeks-wrapper {
		height: auto !important;
		overflow-y: visible !important;
	}
}



.msar-grid-favorites-button {
	font-size: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 35px;
	height: 35px;
	background-color: #ffffff !important;
	box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, .2);
	border: 2px solid white;
	border-radius: 50%;
	cursor: pointer;
	text-align: center;
	margin: 0;
	padding: 0;
	transition: border-color 200ms ease-in-out;
}

.msar-grid-favorites-button:focus {
	outline: none;
	background-color: transparent;
}

.msar-grid-favorites-button:hover {
	border-color: #f85464;
	background-color: transparent;
}

.msar-grid-favorites-button:hover::after {
	color: #f85464;
}

.msar-grid-favorites-button.active {
	border-color: #ffffff;
}

.msar-grid-favorites-button.active::after {
	color: #f85464;
	font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 48;
}

.msar-grid-favorites-button::after {
	color: #444444;
	font-family: 'Material Symbols Outlined', sans-serif;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
	font-size: 20px;
	line-height: 1;
	display: block;
	content: '\e87d';
	padding-top: 4px; /** To make it more "centered" */
	transition: color 200ms ease-in-out;
}
