.hidden {
    display: none !important;
}

.required-text {
  color: red !important;
}

/* Delivery Radio button css */
.radio-container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.radio-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.radio-container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radio-container input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radio-container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.radio-container .checkmark:after {
 	top: 7px;
	left: 7px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: white;
}

/* Promo bar on tiffin page */
  .promo-bar{
  /* position:sticky; */
  /* top:0; */
  /* z-index:9999; */
  width:100%;
  /* backdrop-filter: blur(6px); */
  /* -webkit-backdrop-filter: blur(6px); */
  /* box-shadow: 0 4px 14px rgba(0,0,0,0.08);
  border-bottom: 1px solid rgba(255,255,255,0.06); */
  /* animation: slideIn 300ms ease; */
  text-align: center;
  }
  .promo-inner{
  max-width:1200px;
  margin:0 auto;
  /* padding:12px 18px; */
  
  align-items:center;
  justify-content:space-between;
  gap:12px;
  /* background: linear-gradient(90deg, rgba(255,248,230,0.95), rgba(255,242,245,0.95)); */
  /* border-radius:0 0 10px 10px; */
  }
  .promo-left{ gap:12px; align-items:center;}
  .spark{ font-size:20px; margin-left:4px; }
  .title{ font-weight:700; font-size:15px; color:#1f2937; }
  .subtitle{ font-size:14px; color:#374151; opacity:0.95; font-style: italic;}
  .promo-actions{ gap:8px; align-items:center; }
  .promo-cta{
  background:linear-gradient(90deg,#ff6b6b,#ff8e53);
  color:white;
  /* padding:8px 14px; */
  border-radius:12px;
  text-decoration:none;
  font-weight:600;
  box-shadow: 0 6px 18px rgba(255,110,110,0.18);
  transition: transform .12s ease;
  }
  /* .promo-cta:active{ transform: translateY(1px); } */
  .promo-dismiss{
  background:transparent;
  border:0;
  font-size:16px;
  cursor:pointer;
  color:#6b7280;
  padding:6px;
  border-radius:8px;
  }
  .promo-dismiss:hover{ background: rgba(0,0,0,0.04); }

  /* Responsive */
  @media (max-width:640px){
  .promo-inner{ padding:10px; gap:8px; flex-direction:column; align-items:stretch; text-align:center; }
  .promo-actions{ justify-content:center; margin-top:6px; }
  }

.cuisine-title {
    background-color: #fff !important;
    border: 0 !important;
    border-radius: 60px;
    color: #ab3825 !important;
    padding: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    border-bottom: 2px solid #ab3825 !important;
    font-weight: 800;
}

header.main_header{
  position: sticky;
  top: 0;
  z-index: 999;
}
#contact-form label, #contact-form textarea{
  font-size: 14px;
}

@media screen and (max-width: 767px) {
  #contact-popup{
    right: 0px!important;
    width: auto!important;
    margin:10px;
  }
}

.btn-danger {
  border-color: #dc3545 !important;
}

.alert.alert-danger, .alert.alert-success {
   width:100% !important;
   font-weight: 500 !important;
}

/* Index page css */
.custom-close-btn {
  float: right;
  position: absolute;
  right: 10px;
  top: 10px;
  padding: 10px;
  background-color: #ffffff;
  opacity: 1;
  border-radius: 50px;
}
.custom-modal-body {
  padding: 0px !important;
}
.img-fluid {
  border-radius: 10px;
}
.offer_modal {
  border-radius: 20px;
  background-color: #720d04;
}

/* Contact Us Floating Button */
#contact-widget {
  position: fixed;
  bottom: 20px;
  right: 20px;
}
#contact-btn {
  background: #03573a;
  color: white;
  border: none;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  font-size: 34px;
  cursor: pointer;
  box-shadow: 0 4px 6px rgba(0,0,0,0.2);
}
/* Contact Us Popup Form */
#contact-popup {
  /*display: none;*/
  position: fixed;
  bottom: 70px;
  right: 20px;
  width: 350px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  padding: 21px;

  opacity: 0;
  transform: translateY(20px);
  pointer-events: none;
  transition: all 0.3s ease;
  z-index: 999;
}

#contact-popup.active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.popup-header {
  display: flex;
  justify-content: space-between;
  font-weight: bold;
  margin-bottom: 10px;
}
.popup-header span {
  cursor: pointer;
}
#contact-form input,
#contact-form textarea, 
#contact-form button {
  width: 100%;
  padding: 10px;
  margin: 6px 0;
  border: 1px solid #ccc;
  border-radius: 6px;
}
#contact-form button {
  background: #03573a;
  color: white;
  border: none;
  cursor: pointer;
}
#contact-form button:hover {
  background: #03573a;
}

/* Feedback Button */
#feedback-btn {
  position: fixed;
  top: 40%;
  right: 0;
  background: #ff6408;
  color: white;
  padding: 16px 10px;
  font-weight: 500;
  cursor: pointer;
  border-radius: 0px 8px 8px 0px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
  box-shadow: 0 0px 0px rgba(0, 0, 0, 0.2);
  z-index: 1000;  
}
/* Feedback Popup Form (hidden by default) */
#feedback-popup {
  position: fixed;
  top: 50%;
  right: 70px; /* keeps space from button */
  transform: translateY(-50%) translateX(20px);
  width: 300px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  padding: 15px;

  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease;
  z-index: 999;
}
/* Active state (visible) */
#feedback-popup.active {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
  pointer-events: auto;
}
#feedback-form input,
#feedback-form textarea,
#feedback-form button {
  width: 100%;
  padding: 10px;
  margin: 6px 0;
  border: 1px solid #ccc;
  border-radius: 6px;
}
#feedback-form button {
  background: #03573a;
  color: white;
  border: none;
  cursor: pointer;
}
#feedback-form button:hover {
  background: #03573a;
}

.feedback_popup-header{
	display: flex;
  justify-content: space-between;
  font-weight: bold;
  margin-bottom: 10px;

}
.feedback_popup-header span {
	cursor: pointer;
 }

.stars {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
}
.stars input { display: none !important; }

.stars label::before {
  content: '★';
  font-size: 35px;
  color: #ccc; /* default grey */
  transition: color 0.2s;
}

.stars label {
  cursor: pointer;          /* hand cursor */
  user-select: none;        /* disable text cursor */
  -webkit-user-select: none;
  -moz-user-select: none;
}

.stars label:hover::before,
.stars label:hover ~ label::before {
  color: gold;
}

.stars input:checked ~ label::before {
  color: gold;
}

.whitebg{
  background-color: #fff !important;
}

.mb-20 {
  margin-bottom: 20px;
}

/* Weekly Menu Css starts */
.btn-submit-date {
  background: transparent;
  max-width: 150px;
  border: 0px !important;
  color: #fff !important;
}
.indian_plan_button, .global_plan_button, .salad_plan_button{
  border-radius: 20px 20px 0px 0px !important;
  border:none !important;
}

.indian_plan_button{
  background: var(--blue-80) !important;
}
.global_plan_button{
  background:var(--red-40) !important;
}
.salad_plan_button{ 
  background: var(--yellow-100) !important;
}
.main-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.menutype {
  position: absolute;
  bottom: 12px;
  left: 10px;
}
.Current_menus {
  background: #ad311c;
  padding: 10px 14px 10px 14px;
  color: #ffffff;
  border-radius: 20px;
}
.menu-container {
  display: flex;
  flex-direction: column;
  gap: 0px;
  background: #fff;
  border-radius: 10px;
}
.row.all_menus-show {
  /* border: 1px dashed #ad311c; */
  padding: 20px 20px 20px 20px;
  /* gap: 20px; */
  background: #ffffff;
  border-radius: 10px;
}
.menu-container h3 {
  width: calc(100% - 15px);
  background: #ad311c;
  border: 1px dashed #ad311c;
  padding: 10px 10px;
  color: #ffffff;
  border-radius: 10px;
  text-align: center;
  margin: 0px 7.5px;
  font-weight: 600;
  text-transform: capitalize;
  line-height: normal;
  font-family: "Inter", sans-serif;
}
.nametype.row.indian {
  width: 98%;
  border: 1px solid #85baff;
  padding: 15px 0px;
  background: #ffffff;
  border-radius: 10px;
  height: 100%;
  display: block;
}
.nametype.row.Global {
  width: 98%;
  border: 1px solid #f16755;
  padding: 15px 0px;
  background: #ffffff;
  border-radius: 10px;
  height: 100%;
  display: block;
}
.nametype.row.salad {
  width: 98%;
  border: 1px solid #ffb400;
  padding: 15px 0px;
  background: #ffffff;
  border-radius: 10px;
  height: 100%;
  display: block;
}
h5.itemname {
  color: #000000;
  font-weight: 500;
  text-transform: capitalize;
  margin-bottom: 0px;
  line-height: normal;
  font-size: 14px;
  font-family: "Inter", sans-serif;
  text-align: center !important;
}
.menu_main_container{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.border_inner input{
  font-size: 16px !important;
} 
.border_inner {
  display: flex;
  flex-direction: column;
  /* border: dashed; */
  padding: 3px 5px;
  border-width: 1px;
  gap: 10px;
  font-size: 14px;
  border-radius: 10px;
}
.row.all_menus-show {
  margin-bottom: 20px;
  margin-top: 20px;
}
.veg_toggle .chekbox_switch_round{
  background: #03573a;
}
.veg_toggle .chekbox_switch input:checked + .chekbox_switch_slider {
  background-color: #af321d;
}

.days_tabs {
  display: flex;
  flex-direction: row;
  gap: 10px;
  margin-top:20px;
  max-width: 100%;
  overflow-x: auto;
  padding: 20px 0px;
}

.border_inner a {
  color: #fff !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size:13px !important;
  min-width: 100px;
}
.menu-container .plan_button {
  width: 100% !important;
  margin: 0px;
}
.Current_menus_active {
  background: #03573a !important;
}

@media only screen and (min-width:768.1px) {
  .menu-container .plan_button {
    max-width: 300px;  
  }
}
@media only screen and (max-width: 768px) {
  .row.all_menus-show {
    margin-left: 15px !important;
    margin-right: 15px !important;
    max-width: calc(100% - 30px);
  }
}
.menu_main_container::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
.menu_main_container::-webkit-scrollbar-track {
  background: #f1f1f1;
}
.menu_main_container::-webkit-scrollbar-thumb {
  background-color: #888;
  border-radius: 10px;
}
.nametype .menu_item_image {
  max-width: 100%;
  background: #f5f5f4;
  min-height: 170px;
  object-fit: cover;
  max-height: 170px;
  width: 100%;
}
.indian_item_div{
  border: 2px solid var(--blue-80) !important;
}
.global_item_div{
  border: 2px solid var(--red-40) !important;
}
.salad_item_div{
  border: 2px solid var(--yellow-100) !important;
}
/* Weekly Menu css ends */

/* For pay Summary Page */
.position-relative input[type="checkbox"]:checked+label,
.position-relative input[type="radio"]:checked+label {
    background-color: #ffb400;
    border-radius: 100px;
    padding: 0;
    width: 40px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Tiffin meal card design */
.meal-card {
  border-radius: 14px;
  border: 2px solid #dcdcdc;
  box-shadow: 0px 2px 8px rgba(0,0,0,0.05);
  margin-bottom: 15px;
  overflow: hidden;
}

.meal-title {
  padding: 10px 15px;
  font-weight: 600;
  font-size: 16px;
}

.meal-content {
  padding: 15px;
  background: #fff;
}

.meal-content p {
  margin-bottom: 6px;
}

/* From Uiverse.io by gharsh11032000 */ 
.meal-plan-tabs {
  display: flex;
  gap: 8px;
}

.meal-plan-tab-group input {
  display: none;
}

.meal-plan-tab-group label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 50px;
  line-height: 1.6;
  border: 1px solid #cccccc;
  border-radius: 12px;
  cursor: pointer;
  font-weight: 700;
  font-size: 12px;
  position: relative;
  background-color: transparent;
  transition: all 0.48s cubic-bezier(0.23, 1, 0.32, 1);
}

.meal-plan-tab-group label::after {
  content: "";
  position: absolute;
  bottom: -32px;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  transform: translateX(-50%);
  transform-origin: 0 0;
  scale: 0;
  opacity: 0;
  z-index: -1;
  transition: all 0.48s 0.2s cubic-bezier(0.23, 1, 0.32, 1);
}

.meal-plan-tab-group label::before {
  content: "";
  position: absolute;
  top: -24px;
  left: 50%;
  width: 100px;
  height: 50px;
  border-radius: 12px;
  transform: translate(-50%, -50%);
  z-index: -1;
  opacity: 0;
  scale: 0;
  transform-origin: 0 0;
  transition: all 0.48s cubic-bezier(0.23, 1, 0.32, 1);
}

/* Regular */
.meal-plan-tab-group.reg label::after,
.meal-plan-tab-group.reg label::before {
  background-color: #85baff;
}

.meal-plan-tab-group.reg label:hover {
  border-color: #85baff;
  color: #85baff;
}

/* Large */
.meal-plan-tab-group.lg label::after,
.meal-plan-tab-group.lg label::before {
  background-color: #f16755;
}

.meal-plan-tab-group.lg label:hover {
  border-color: #f16755;
  color: #f16755;
}

/* Large Premium */
.meal-plan-tab-group.lg-pre label::after,
.meal-plan-tab-group.lg-pre label::before {
  background-color: #ffb400;
}

.meal-plan-tab-group.lg-pre label:hover {
  border-color: #ffb400;
  color: #ffb400;
}

.meal-plan-tab-group input:checked + label {
  border-color: transparent;
  color: #ffffff !important;
  scale: 1.1;
}

.meal-plan-tab-group input:checked + label::after {
  bottom: -16px;
  opacity: 1;
  scale: 1;
  box-shadow:
    0rem 6px 13px rgba(10, 60, 255, 0.1),
    0rem 24px 24px rgba(10, 60, 255, 0.09),
    0rem 55px 33px rgba(10, 60, 255, 0.05),
    0rem 97px 39px rgba(10, 60, 255, 0.01),
    0rem 152px 43px rgba(10, 60, 255, 0);
}

.meal-plan-tab-group input:checked + label::before {
  opacity: 1;
  scale: 1;
  top: 50%;
  box-shadow:
    0rem 6px 13px rgba(10, 60, 255, 0.1),
    0rem 24px 24px rgba(10, 60, 255, 0.09),
    0rem 55px 33px rgba(10, 60, 255, 0.05),
    0rem 97px 39px rgba(10, 60, 255, 0.01),
    0rem 152px 43px rgba(10, 60, 255, 0);
}
