/* html,
body {
  -webkit-overflow-scrolling: touch;
  overflow: scroll;
} */
g.amcharts-AmChartsLogo-group { display: none!important; }

body { margin-bottom: 60px!important; }
main { padding-bottom: 60px!important; }

.col a,
.eok-recipe-teaser a,
.card-body,
.eok-kcal {
  text-decoration: none !important;
  color: var(--bs-body-color) !important;
}

.eok-delete {
  position: absolute;
  right: 15px;
  top: 15px;
  z-index: 99;
  border-radius: 50px;
}

.eok-delete-small {
  position: absolute;
  right: 15px;
  top: 5px;
  z-index: 99;
  border-radius: 50px;
}

.eok-view {
  position: absolute;
  right: 15px;
  top: 15px;
  z-index: 99;
}

.eok-delete a {
  color: #fff !important;
  font-size: 12px;
  border-radius: 20px;
  padding: 5px 8px;
}

.eok-view a {
  color: var(--bs-body-color);
}

.eok-delete-small a {
  color: #fff !important;
  font-size: 12px;
  border-radius: 20px;
  padding: 4px 6px;
  line-height: normal;
}

.eok-kcal {
  position: absolute;
  left: 15px;
  top: 15px;
  background-color: #fff;
  padding: 0.5rem;
  border-radius: 10px;
}

.eok-recipe {
  height: 250px;
  width: 100%;
  background-size: cover;
  background-position: center;
}

.eok-youtube {
  border-radius: 10px !important;
  overflow: hidden;
}

.eok-addrecipe {
  padding: 10px 20px 20px 20px;
  background-color: #f5f5f5;
  border-radius: 10px;
}

.eok-whitebox {
  padding: 10px 20px 20px 20px;
  border-radius: 10px;
  border: 3px solid #f5f5f5;
}

.eok-cookingmode {
  font-size: 22px !important;
}

.eok-warning {
  position: absolute;
  top: 0px;
  background-color: #dc3545 !important;
  padding: 6px 0px;
  width: 100%;
  font-size: 14px;
}

.eok-info {
  position: absolute;
  top: 0px;
  background-color: #0b5ed7;
  padding: 6px 0px;
  width: 100%;
  font-size: 14px;
}

.eok-strong {
  color: #157347 !important;
}

.eok-date-button {
  width: 100%;
  border: 2px solid #ededed;
  background-color: #fff;
  border-radius: 8px;
  padding: 5px 0px;
  position: relative;
}

.eok-date-button-today {
  border: 2px solid #0d6efd;
  background-color: #0d6efd20;
}

.eok-date-button-right:before {
  font-family: bootstrap-icons !important;
  content: "\F27B";
  font-size: 30px;
  position: absolute;
  right: 0px;
  top: lc(50% - 21px);
  color: #d2d2d2;
}

.eok-date-button-left:before {
  font-family: bootstrap-icons !important;
  content: "\F27A";
  font-size: 30px;
  position: absolute;
  left: 0px;
  top: calc(50% - 21px);
  color: #d2d2d2;
}

p.eok-date-day {
  margin-bottom: 0px !important;
  font-weight: bold;
  font-size: 18px;
  color: #b8b8b8;
}

p.eok-date-date {
  margin-bottom: 0px !important;
  font-size: 11px;
  color: #000000!important;
}

.eok-date-button-today p.eok-date-day {
  color: #0d6efd !important;
}

span.eok-nutri {
  display: block;
  font-size: 10px;
  margin-bottom: 0px;
}

span.eok-nutri-value {
  display: block;
  font-size: 16px;
  font-weight: bold;
  margin-top: 0px;
}

.eok-btncor {
  position: relative;
  top: 15px;
  z-index: 99;
}

.eok-recipe-overlay {
  background-color: rgba(255, 255, 255, 0.92);
  padding: 15px;
  border-radius: 8px;
}

.eok-recipe-overlay-outterbox {
  color: #000;
  padding: 0px 10px;
  position: relative;
  top: -50px;
}

hr.eok-small-hr {
  margin-top: 0.7rem;
  margin-bottom: 0.7rem;
}

.eok-newcard {
  border: none !important;
}

.eok-tab-left {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  position: relative;
}

.eok-tab-right {
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  position: relative;
}

.eok-object-width {
  width: 100%;
}

.eok-shopping-list {
  background-color: #fffbed;
  border-radius: 10px;
  padding: 5px 15px;
}

.eok-ing-category {
  font-weight: bold;
  margin-left: 3px;
  position: relative;
  top: -11px;
}

.eok-alert-small {
  font-size: 12px;
}

.eok-goal-size {
  font-size: 1.8rem;
}

small.eok-small-addon {
  color: #aaa;
  font-size: 14px;
  font-weight: normal;
}

#myBtn {
  display: none;
  /* Hidden by default */
  position: fixed;
  /* Fixed/sticky position */
  bottom: 20px;
  /* Place the button at the bottom of the page */
  right: 20px;
  /* Place the button 30px from the right */
  z-index: 99;
  /* Make sure it does not overlap */
  border: none;
  /* Remove borders */
  outline: none;
  /* Remove outline */
  background-color: #90c587;
  /* Set a background color */
  color: white;
  /* Text color */
  cursor: pointer;
  /* Add a mouse pointer on hover */
  padding: 0.75rem 1rem;
  /* Some padding */
  border-radius: 10px;
  /* Rounded corners */
  font-size: 20px;
  /* Increase font size */
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

#myBtn:hover {
  background-color: #555;
  /* Add a dark-grey background on hover */
}

a.eok-backlink {
  color: #0d6efd !important;
  text-decoration: none !important;
}

a.eok-print {
  color: #0d6efd !important;
  float: right;
}

a.eok-coloredlink {
  color: #0d6efd !important;
  text-decoration: underline !important;
}

@media print {
  .noPrint {
    display: none;
  }

  body {
    font-size: 12px !important;
  }
}

.form-switch.form-switch-lg {
  margin-bottom: 1.5rem;
}

.form-switch.form-switch-lg label {
  line-height: 2.5rem;
}

.form-switch.form-switch-lg .form-check-input {
  height: 2rem;
  width: calc(3rem + 0.75rem);
  border-radius: 4rem;
  margin-right: 12px;
}

button.eok-switch {
  width: 100% !important;
  border: 2px solid #ededed !important;
  background-color: #fff !important;
  border-radius: 8px !important;
  padding: 10px 0px !important;
  color: var(--bs-body-color) !important;
  font-weight: bold;
}

button.eok-switch.active {
  color: #68c278 !important;
  border: 2px solid #68c278 !important;
}

.custom-select {
  display: flex;
}

.custom-select .select2-container {
  width: calc(100% - 42px) !important;
}

span.custom-icon {
  display: flex;
  align-items: center;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--bs-body-color);
  text-align: center;
  white-space: nowrap;
  background-color: var(--bs-tertiary-bg);
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: 0 0.375rem 0.375rem 0;
}

.select2-container {
  box-sizing: border-box !important;
  display: inline-block !important;
  margin: 0 !important;
  vertical-align: middle !important;
  /* padding: 0.375rem 0.75rem !important; */
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  color: var(--bs-body-color) !important;
  background-color: var(--bs-tertiary-bg) !important;
  border: none!important;
  border-radius: 0.375rem 0 0 0.375rem !important;
  text-align: center!important;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #ffffff!important;
    padding: 6px 0px;
    font-weight: 400;
    font-size: 1.25rem;
}
.select2-container .select2-selection--single { height: auto!important; }
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #0a58ca;
    line-height: 45px;
}

.eok-myown-pill {
  position: relative;
  top: 5px;
  color: #fff !important;
  font-size: 9px;
  margin: 0 auto;
  display: table;
}

.select2-container--default .select2-selection--single {
  background-color: #0a58ca!important;
  border-style: none;
  border-radius: 0.5rem;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #aaa;
    padding: 10px 6px;
    outline: none!important;
}

.blob { background: black; border-radius: 50%; box-shadow: 0 0 0 0 rgba(0, 0, 0, 1); margin: 0px 2px 0px 0px; height: 8px; width: 8px; transform: scale(1); animation: pulse-black 2s infinite; display: inline-block!important; position: relative; top: -4px; }
.blob.green { background: rgba(51, 217, 178, 1); box-shadow: 0 0 0 0 rgba(51, 217, 178, 1); animation: pulse-green 2s infinite; }
@keyframes pulse-green {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(51, 217, 178, 0.7); }
  70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(51, 217, 178, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(51, 217, 178, 0); }
}

span.select2-selection__arrow {
  display: none;
}

button.eok-delete-ing {
  position: relative !important;
  float: right !important;
  border-radius: 20px !important;
  font-size: 9px !important;
  padding: 4px 6px !important;
}

.errorTxt {
  color: red;
  font-weight: 500;
}

.eok-recipe-teaser {
  position: relative;
}

.eok-zindex {
  z-index: 99 !important;
}

/* .stuck-only {
  display: none;
} */
#displayAlert {
  margin-top: 15px;
}

.add-recipe-view {
  width: 100%;
}

.recipe-title-div {
  display: flex;
  justify-content: center;
  gap: 14px;
}

.recipe-edit-textbox {
  display: none;
  /* width: 93%;
  margin: 0 10px 0 18px; */
}

.recipe-input {
  height: 53px !important;
}

.recipe-input-div {
  padding: 10px 0px 0px 0px;
}

.box-list {
  border-radius: 5px;
  padding: 0px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.box-part {
  display: flex;
  gap: 10px;
  height: 100%;
}

.box-img div {
  height: 100%;
  background-image: url(img/recipe-dummy.jpg);
  background-position: center;
  background-size: cover;
  padding: 0 5px;
}

.box-text {
  padding: 10px 10px 0 0;
}

.box-text h6 {
  font-size: 15px!important;
  font-weight: 800;
}

.box-btn button {
  padding: 5px;
  font-weight: 500;
  width: 100%;
}

.box-btn {
  padding: 5px 0px;
}

.box-img {
  min-width: 90px;
  min-height: 90px;
  border-radius: 5px;
  margin-right: 6px;
}

.error_vaild {
  margin-bottom: 10px;
  display: none;
}
.success_vaild {
  margin-bottom: 10px;
  display: none;
}

footer.footer { font-size: 12px; }

@media only screen and (max-width: 600px) {
  .add-recipe-view {
    padding-left: 5px;
    padding-right: 5px;
  }

  .box-text {
    padding: 16px 10px 10px 0;
  }

  .box-text h6,
  .weight-part {
    font-size: 14px;
  }
}