@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
@import url(/assets/css/tw_output.css);
:root {
    
    --font-inter: 'Inter', 'sans-serif';

    /* Breakpoints */
    --breakpoint-xs: 320px;
    --breakpoint-2sm: 470px;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --breakpoint-2xl: 1400px;
    --breakpoint-3xl: 1600px;

    /* Colors */
    --color-primary: #26994D;
    --color-secondary: #26C159;
    --color-light-primary: #88EDA9;
    --color-light-secondary: #DDFBE6;
    --color-dark-primary: #186331;
    --color-dark-secondary: #1BAC4B;
    --color-background: #F5F5F5;
    --color-secondary-background: #E0DEDE;
    --color-gold: #FFD300;
    --color-accent: #F65554;
    --color-accent-dark: #cf3939;
    --color-primary-text: #3F3D56;
    --color-secondary-text: #757575;
    --color-white: #ffffff;
}
body {
    font-family: var(--font-inter)!important;
}

.el-input__inner {
    color: var(--color-secondary-text);
}

.el-autocomplete, .el-input {
    --el-input-focus-border-color: var(--color-primary);
}

/* Change header */
#main-search-banner,
.mobile-home-banner {
    background: url("../images/full-header-v2.jpg") center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.el-link {
    --el-link-text-color: var(--color-primary-text);
}

ul.top-menu a:hover, .list-inline a:hover, .menu-category a:hover, .siderbar-menu li.active a, #menu-category .col a.active, .btn.normal:hover, .text-green, a:hover, .menu-carousel a.active, .menu-carousel a:hover {
    color: var(--color-primary)!important;
}

.swiperBanner .swiperSlide {
    min-height: 150px!important;
}
.swiperBanner .swiperSlide .el-image {
    height: 100%!important;
}
/* Normal border radius */
.el-input__wrapper {
    border-radius: 8px !important;
}


.with-promo {
    background-color: var(--color-accent)!important;
    color: var(--color-white)!important;
    border-radius: 20px!important;
    padding: 0.5rem 0.75rem!important;
    max-width: 75%!important;
    margin: 0 auto!important;
    width: inherit!important;
    left: 8px!important;
    top: 8px!important;
}
.swiperResto .swiperSlide img,
.rounded-box img {
    border-top-left-radius: 8px!important;
    border-top-right-radius: 8px!important;
}
.layer-black {
    opacity: 0.5!important;
}

.info-items-dot-separator {
    background-color: var(--color-primary-text);
    height: 5px;
    width: 5px;
}

.icon-delivery {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-color: inherit;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 16 16'><path fill='black' d='M12.37 7.53a3.67 3.67 0 0 0-2.5 1H7.16a.65.65 0 0 1-.38-.13L5 7V4h2V2.75H4.1a2.91 2.91 0 0 0-.33-.37a2.34 2.34 0 0 0-.77-.5a2.64 2.64 0 0 0-1-.18V4h1.75v3.16a.62.62 0 0 1-.09.32L2.19 9.93A2.38 2.38 0 0 0 0 12.2a2.41 2.41 0 0 0 2.5 2.3A2.41 2.41 0 0 0 5 12.2h11V11a3.54 3.54 0 0 0-3.63-3.47zm0 1.25A2.29 2.29 0 0 1 14.75 11H10a2.29 2.29 0 0 1 2.37-2.22zM2.5 13.25a1.16 1.16 0 0 1-1.25-1.05a1.16 1.16 0 0 1 1.25-1a1.16 1.16 0 0 1 1.25 1a1.16 1.16 0 0 1-1.25 1.05zM4.59 11a2.38 2.38 0 0 0-1.06-.83L4.62 8.3L6 9.36a1.9 1.9 0 0 0 1.13.38H9A3.22 3.22 0 0 0 8.75 11z'/><path fill='currentColor' d='M14.75 1.5H11a1.25 1.25 0 0 0-1.3 1.25v3A1.25 1.25 0 0 0 11 7h3.8A1.25 1.25 0 0 0 16 5.75v-3a1.25 1.25 0 0 0-1.25-1.25zm0 4.25H11v-3h3.8zm-2.38 7.5a1.17 1.17 0 0 1-1.25-1.05H9.87a2.41 2.41 0 0 0 2.5 2.3a2.41 2.41 0 0 0 2.5-2.3h-1.25a1.16 1.16 0 0 1-1.25 1.05z'/></svg>") no-repeat center/contain;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 16 16'><path fill='black' d='M12.37 7.53a3.67 3.67 0 0 0-2.5 1H7.16a.65.65 0 0 1-.38-.13L5 7V4h2V2.75H4.1a2.91 2.91 0 0 0-.33-.37a2.34 2.34 0 0 0-.77-.5a2.64 2.64 0 0 0-1-.18V4h1.75v3.16a.62.62 0 0 1-.09.32L2.19 9.93A2.38 2.38 0 0 0 0 12.2a2.41 2.41 0 0 0 2.5 2.3A2.41 2.41 0 0 0 5 12.2h11V11a3.54 3.54 0 0 0-3.63-3.47zm0 1.25A2.29 2.29 0 0 1 14.75 11H10a2.29 2.29 0 0 1 2.37-2.22zM2.5 13.25a1.16 1.16 0 0 1-1.25-1.05a1.16 1.16 0 0 1 1.25-1a1.16 1.16 0 0 1 1.25 1a1.16 1.16 0 0 1-1.25 1.05zM4.59 11a2.38 2.38 0 0 0-1.06-.83L4.62 8.3L6 9.36a1.9 1.9 0 0 0 1.13.38H9A3.22 3.22 0 0 0 8.75 11z'/><path fill='currentColor' d='M14.75 1.5H11a1.25 1.25 0 0 0-1.3 1.25v3A1.25 1.25 0 0 0 11 7h3.8A1.25 1.25 0 0 0 16 5.75v-3a1.25 1.25 0 0 0-1.25-1.25zm0 4.25H11v-3h3.8zm-2.38 7.5a1.17 1.17 0 0 1-1.25-1.05H9.87a2.41 2.41 0 0 0 2.5 2.3a2.41 2.41 0 0 0 2.5-2.3h-1.25a1.16 1.16 0 0 1-1.25 1.05z'/></svg>") no-repeat center/contain;
    transform: scaleX(-1);
}

.icon-dinein {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-color: inherit; 
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M8 19h1.5v-6.75q.65-.2 1.075-.713T11 10.3V6.5q0-.2-.15-.35T10.5 6q-.2 0-.35.15T10 6.5V9h-.75V6.5q0-.2-.15-.35T8.75 6q-.2 0-.35.15t-.15.35V9H7.5V6.5q0-.2-.15-.35T7 6q-.2 0-.35.15t-.15.35v3.8q0 .725.425 1.238T8 12.25V19Zm6 0h1.5v-6.35q.825-.4 1.288-1.275t.462-2.05q0-1.425-.713-2.375T14.75 6q-1.075 0-1.788.95t-.712 2.375q0 1.175.463 2.05T14 12.65V19ZM4 22q-.825 0-1.413-.588T2 20V4q0-.825.588-1.413T4 2h16q.825 0 1.413.588T22 4v16q0 .825-.588 1.413T20 22H4Zm0-2h16V4H4v16Zm0 0V4v16Z'/></svg>") no-repeat center/contain;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='currentColor' d='M8 19h1.5v-6.75q.65-.2 1.075-.713T11 10.3V6.5q0-.2-.15-.35T10.5 6q-.2 0-.35.15T10 6.5V9h-.75V6.5q0-.2-.15-.35T8.75 6q-.2 0-.35.15t-.15.35V9H7.5V6.5q0-.2-.15-.35T7 6q-.2 0-.35.15t-.15.35v3.8q0 .725.425 1.238T8 12.25V19Zm6 0h1.5v-6.35q.825-.4 1.288-1.275t.462-2.05q0-1.425-.713-2.375T14.75 6q-1.075 0-1.788.95t-.712 2.375q0 1.175.463 2.05T14 12.65V19ZM4 22q-.825 0-1.413-.588T2 20V4q0-.825.588-1.413T4 2h16q.825 0 1.413.588T22 4v16q0 .825-.588 1.413T20 22H4Zm0-2h16V4H4v16Zm0 0V4v16Z'/></svg>") no-repeat center/contain;
}

.icon-pickup, .icon-takeout {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-color: inherit; 
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'><path d='m12.44 9.127l-1.408 5.635l4.93 6.339m-5.634-2.817L8.215 21.1'/><path d='M8.215 13.353c0-3.944 2.817-4.226 4.226-4.226h1.408c.235 1.174 1.268 3.663 3.522 4.226M13 7a2 2 0 1 0 0-4a2 2 0 0 0 0 4Z'/></g></svg>") no-repeat center/contain;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'><path d='m12.44 9.127l-1.408 5.635l4.93 6.339m-5.634-2.817L8.215 21.1'/><path d='M8.215 13.353c0-3.944 2.817-4.226 4.226-4.226h1.408c.235 1.174 1.268 3.663 3.522 4.226M13 7a2 2 0 1 0 0-4a2 2 0 0 0 0 4Z'/></g></svg>") no-repeat center/contain;
}

.ba-tooltip {
    position: absolute;
    top: -28px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 8px;
    min-width: max-content;
    padding: 2px 4px;
    background: var(--color-primary-text);
    color: white;
}

.ba-tooltip::before {
    content: '';
    width: 8px;
    height: 8px;
    background: var(--color-primary-text);
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    transform: rotate(45deg);
}
.ba-discount-fire {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-color: inherit; 
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 14 14"><path fill="currentColor" fill-rule="evenodd" d="M5.365.263A.5.5 0 0 1 5.867.11c1.109.289 2.813 1.04 4.249 2.377c1.447 1.349 2.631 3.306 2.631 5.975c0 1.057-.237 2.35-1.058 3.421c-.834 1.09-2.217 1.88-4.363 2.013H7.32c-2.86.144-4.868-1.342-5.675-3.389c-.8-2.029-.399-4.553 1.404-6.468a.5.5 0 0 1 .74.012l1.265 1.436c.463-.826.688-1.546.722-2.267c.035-.733-.127-1.507-.5-2.44a.5.5 0 0 1 .09-.517Zm-.05 7.605a.75.75 0 1 1 1.5 0a.75.75 0 0 1-1.5 0m3.99.126a.5.5 0 0 0-.708-.707L5.314 10.57a.5.5 0 1 0 .707.707zm-1.33 2.703a.75.75 0 1 1 1.5 0a.75.75 0 0 1-1.5 0" clip-rule="evenodd"/></svg>') no-repeat center/contain;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 14 14"><path fill="currentColor" fill-rule="evenodd" d="M5.365.263A.5.5 0 0 1 5.867.11c1.109.289 2.813 1.04 4.249 2.377c1.447 1.349 2.631 3.306 2.631 5.975c0 1.057-.237 2.35-1.058 3.421c-.834 1.09-2.217 1.88-4.363 2.013H7.32c-2.86.144-4.868-1.342-5.675-3.389c-.8-2.029-.399-4.553 1.404-6.468a.5.5 0 0 1 .74.012l1.265 1.436c.463-.826.688-1.546.722-2.267c.035-.733-.127-1.507-.5-2.44a.5.5 0 0 1 .09-.517Zm-.05 7.605a.75.75 0 1 1 1.5 0a.75.75 0 0 1-1.5 0m3.99.126a.5.5 0 0 0-.708-.707L5.314 10.57a.5.5 0 1 0 .707.707zm-1.33 2.703a.75.75 0 1 1 1.5 0a.75.75 0 0 1-1.5 0" clip-rule="evenodd"/></svg>') no-repeat center/contain;
}
.ba-discount-round {
    display: inline-block;
    width: 80px;
    height: 80px;
    background-color: inherit; 
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 24 24"><path fill="currentColor" d="M13.946 2.094a3 3 0 0 0-3.892 0L8.706 3.243a1 1 0 0 1-.569.236l-1.765.14A3 3 0 0 0 3.62 6.371l-.14 1.766a1 1 0 0 1-.237.569l-1.148 1.348a3 3 0 0 0 0 3.891l1.148 1.349a1 1 0 0 1 .236.569l.141 1.765a3 3 0 0 0 2.752 2.752l1.765.14a1 1 0 0 1 .57.237l1.347 1.148a3 3 0 0 0 3.892 0l1.348-1.148a1 1 0 0 1 .57-.236l1.765-.141a3 3 0 0 0 2.752-2.752l.14-1.765a1 1 0 0 1 .236-.57l1.149-1.347a3 3 0 0 0 0-3.892l-1.149-1.348a1 1 0 0 1-.236-.57l-.14-1.765a3 3 0 0 0-2.752-2.752l-1.766-.14a1 1 0 0 1-.569-.236zm.882 5.663l1.415 1.414l-7.071 7.072l-1.415-1.415zm-4.596 2.475a1.5 1.5 0 1 1-2.121-2.121a1.5 1.5 0 0 1 2.121 2.121m3.536 5.657a1.5 1.5 0 1 1 2.12-2.121a1.5 1.5 0 0 1-2.12 2.12"/></svg>') no-repeat center/contain;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 24 24"><path fill="currentColor" d="M13.946 2.094a3 3 0 0 0-3.892 0L8.706 3.243a1 1 0 0 1-.569.236l-1.765.14A3 3 0 0 0 3.62 6.371l-.14 1.766a1 1 0 0 1-.237.569l-1.148 1.348a3 3 0 0 0 0 3.891l1.148 1.349a1 1 0 0 1 .236.569l.141 1.765a3 3 0 0 0 2.752 2.752l1.765.14a1 1 0 0 1 .57.237l1.347 1.148a3 3 0 0 0 3.892 0l1.348-1.148a1 1 0 0 1 .57-.236l1.765-.141a3 3 0 0 0 2.752-2.752l.14-1.765a1 1 0 0 1 .236-.57l1.149-1.347a3 3 0 0 0 0-3.892l-1.149-1.348a1 1 0 0 1-.236-.57l-.14-1.765a3 3 0 0 0-2.752-2.752l-1.766-.14a1 1 0 0 1-.569-.236zm.882 5.663l1.415 1.414l-7.071 7.072l-1.415-1.415zm-4.596 2.475a1.5 1.5 0 1 1-2.121-2.121a1.5 1.5 0 0 1 2.121 2.121m3.536 5.657a1.5 1.5 0 1 1 2.12-2.121a1.5 1.5 0 0 1-2.12 2.12"/></svg>') no-repeat center/contain;
}

.ba-swiper-button-next-top, 
.ba-swiper-button-prev-top
 {
    position: absolute;
    top: -30px;
    right: 0;
}
.ba-swiper-button-prev-top {
    right: 50px !important;
    left: unset !important;
}
.ba-swiper-button-next-top > .el-button:hover, 
.ba-swiper-button-prev-top > .el-button:hover,
.swiper-button-next > .el-button:hover,
.swiper-button-prev > .el-button:hover 
{
    background-color: var(--color-light-secondary)!important;
    color: var(--color-primary)!important;
    border: 1px solid var(--color-primary)!important;
}

.owl-carousel .owl-item {
    min-height: 10px;
}
.category-carousel .nav-link {
    height: auto;
}
.category-carousel .nav-link:hover {
    background-color: var(--color-light-secondary) !important;
    color: var(--color-primary) !important;
    
}

.category-carousel .nav-link.active {
    background-color: var(--color-dark-primary) !important;
    color: var(--color-white) !important;
}

.category-carousel .nav-link.active::after {
    border: 0;
}
input[type="radio"].ba-custom-radio:checked::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  border-radius: 9999px;
  background: var(--color-dark-primary);
  line-height: normal;
}
input[type="checkbox"].ba-custom-checkbox:checked::before {
  content: '\2713';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 20px;
  color: var(--color-white);
}

a[disabled="true"], button[disabled], .el-button--disabled, .el-button--disabled:hover, .el-button--disabled:focus {
    background-color: var(--color-secondary-background) !important;
    color: var(--color-secondary-text) !important;
}

.el-button[aria-expanded="true"] {
    background-color: var(--color-primary);
    color: var(--color-white);
}
.el-button[aria-expanded="false"] {
    background-color: var(--color-secondary-background);
    color: var(--color-primary-text);
}

.el-dropdown-menu__item.sort_list:not(.is-disabled):focus {
    background-color: var(--color-light-secondary) !important;
    color: var(--color-dark-primary) !important;
}

.btn-green, .btn-grey:hover, .badge.badge-green, .btn-green-line:hover {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
}
.custom-control-input:checked ~ .custom-control-label::before {
    background: var(--color-dark-primary) !important;
    color: var(--color-white) !important;
}





/* Color */
.el-tabs__item.is-active, .el-tabs__item:hover {
    color: var(--color-secondary) !important;
}
ul.sub-menu li.active a, ul.sub-menu li.active a:hover {
    color: var(--color-dark-primary)!important;
}
.btn-white, .el-backtop {
    color: var(--color-primary);
}

/* Background color */
.el-tabs__active-bar {
    background-color: var(--color-secondary) !important;
}
ul.sub-menu li.active a{
    background: var(--color-light-secondary);
}
/* color as secondary */ 
.text-success {
    color: var(--color-secondary) !important;
}

/* 

.custom-control-label::before {
    top: 2px;
    left: -20px;
    width: 20px;
    height: 20px;
    border: 2px solid var(--color-secondary-text);
}

.custom-radio .custom-control-input:checked~.custom-control-label::after {
    width: 12px;
    height: 12px;
    background: var(--color-dark-primary);
    border-radius: 20px;
    top: 7px;
    left: -20px;
}
.custom-control-input:checked ~ .custom-control-label::before {
    width: 20px;
    height: 20px;
    border: 2px solid var(--color-dark-primary);
    border-radius: 50%;
    background-color: unset;
    top: 2px;
} */