/*convert px to vw*/
.cart {
  min-width: 45px;
  height: 45px;
  font-size: 20px;
  color: var(--color-primary);
}
@media (min-width: 1920px) {
  .cart {
    min-width: 2.34375vw;
    height: 2.34375vw;
    font-size: 1.0416666667vw;
  }
}
.cart--count {
  width: var(--spacing-20);
  height: var(--spacing-20);
  background: var(--color-secondary);
  top: var(--spacing-3);
  right: var(--spacing-3);
  border: var(--spacing-3) solid var(--color-white);
  color: var(--color-white);
  font-size: var(--spacing-sm);
  line-height: var(--spacing-7);
}
@media (min-width: 1920px) {
  .cart--count {
    width: 1.0416666667vw;
    height: 1.0416666667vw;
    top: 0.15625vw;
    right: 0.15625vw;
    border-width: 0.15625vw;
    font-size: 0.4166666667vw;
    line-height: 0.4166666667vw;
  }
}

.category--list {
  padding: var(--spacing-0) var(--spacing-lg);
  margin: var(--spacing-0) var(--auto);
  position: var(--relative);
}
@media (min-width: 768px) {
  .category--list {
    padding: var(--spacing-0) var(--spacing-xxl);
  }
}
.category--list .nav {
  padding: var(--spacing-20) var(--spacing-0);
  overflow-x: var(--auto);
  overflow-y: var(--hidden);
  border-bottom: var(--none);
  margin-bottom: var(--spacing-10);
}
@media (min-width: 768px) {
  .category--list .nav {
    padding: var(--spacing-20) var(--spacing-10) var(--spacing-10) var(--spacing-10);
  }
}
@media (min-width: 1920px) {
  .category--list .nav {
    padding: 1.0416666667vw 0.5208333333vw 0.5208333333vw 0.5208333333vw;
  }
}
.category--list .nav-item {
  margin-right: var(--spacing-15);
}
@media (min-width: 992px) {
  .category--list .nav-item {
    margin-right: var(--spacing-30);
  }
}
@media (min-width: 1400px) {
  .category--list .nav-item {
    margin-right: var(--spacing-xxl);
  }
}
@media (min-width: 1920px) {
  .category--list .nav-item {
    margin-right: 2.5vw;
  }
}
.category--list .nav-link {
  white-space: var(--nowrap);
  padding: var(--spacing-0);
  border: var(--none);
  font-size: var(--spacing-md);
  line-height: var(--spacing-18);
  font-weight: var(--weight-5);
  color: var(--color-secondary);
  display: var(--flex);
  flex-wrap: wrap;
  align-items: var(--center);
  text-align: var(--center);
  justify-content: var(--center);
}
@media (min-width: 768px) {
  .category--list .nav-link {
    flex-wrap: var(--nowrap);
  }
}
@media (min-width: 1920px) {
  .category--list .nav-link {
    font-size: 0.9375vw;
    line-height: 1.09375vw;
  }
}
.category--list .nav-link span {
  position: var(--relative);
  padding-bottom: var(--spacing-xs);
  border-bottom: var(--spacing-2) solid var(--color-transparent);
  font-size: var(--spacing-10);
  line-height: var(--spacing-11);
}
@media (min-width: 768px) {
  .category--list .nav-link span {
    margin-left: var(--spacing-10);
    font-size: var(--spacing-md);
    line-height: var(--spacing-18);
  }
}
@media (min-width: 1920px) {
  .category--list .nav-link span {
    font-size: 0.9375vw;
    line-height: 1.09375vw;
    border-width: 0.1041666667vw;
    margin-right: 0.5208333333vw;
  }
}
.category--list .nav-link.active {
  color: var(--color-primary);
}
.category--list .nav-link.active span {
  position: var(--relative);
  border-color: var(--color-primary);
}
.category--list .pointer {
  position: var(--absolute);
  left: var(--spacing-0);
  top: var(--spacing-md);
  cursor: var(--pointer);
}
@media (min-width: 768px) {
  .category--list .pointer {
    left: var(--spacing-md);
  }
}
.category--list .pointer.dis {
  opacity: 0.2;
}
.category--list .pointer:last-child {
  left: var(--auto);
  right: var(--spacing-0);
}
@media (min-width: 768px) {
  .category--list .pointer:last-child {
    right: var(--spacing-md);
  }
}
.category--card {
  padding: var(--spacing-lg) var(--spacing-12) var(--spacing-12) var(--spacing-12);
  border-radius: var(--spacing-20);
  background: var(--color-gray-light);
  /* box-shadow: var(--spacing-0) var(--spacing-0) var(--spacing-10) var(--spacing-0) var(--color-black-rgb06) inset; */
  /* max-height: calc(100dvh - 190px);
  min-height: calc(100dvh - 190px);
  overflow-y: var(--auto);
  overflow-x: var(--hidden);
  height: 100%; */
}
@media (min-width: 768px) {
  .category--card {
    padding: var(--spacing-md);
  }
}
@media (min-width: 1920px) {
  .category--card {
    /* max-height: calc(100dvh - 9.8958333333vw);
    min-height: calc(100dvh - 9.8958333333vw); */
    padding: 1.5625vw;
    border-radius: 1.0416666667vw;
    /* box-shadow: var(--spacing-0) var(--spacing-0) 0.5208333333vw var(--spacing-0) var(--color-black-rgb06) inset; */
  }
}
.category--card--skip {
  /* max-height: calc(100dvh - 125px); */
  min-height: calc(100dvh - 125px);
}
@media (min-width: 1920px) {
  .category--card--skip {
    /* max-height: calc(100dvh - 6.5104166667vw); */
    min-height: calc(100dvh - 6.5104166667vw);
  }
}

.item--card {
  border: var(--spacing-3) solid var(--color-transparent) !important;
  cursor: var(--pointer);
}
@media (min-width: 1920px) {
  .item--card {
    border-width: 0.15625vw;
  }
}
.item--card:hover, .item--card:focus {
  border-color: var(--color-primary) !important;
}
.item--img {
  min-height: var(--spacing-full);
  width: 35%;
  max-width: 120px;
  min-width: 120px;
}
@media (min-width: 768px) {
  .item--img {
    max-width: 150px;
    min-width: 150px;
  }
}
@media (min-width: 1920px) {
  .item--img {
    max-width: 7.8125vw;
    min-width: 7.8125vw;
  }
}
.item--img img {
  height: var(--spacing-full);
  object-fit: var(--cover);
  border-top-left-radius: var(--spacing-20);
  border-bottom-left-radius: var(--spacing-20);
}
@media (min-width: 1920px) {
  .item--img img {
    border-top-left-radius: 1.042vw;
    border-bottom-left-radius: 1.042vw;
  }
}
.item--box {
  padding: var(--spacing-10);
  min-height: var(--spacing-full);
  width: 65%;
  box-sizing: border-box;
}
@media (min-width: 768px) {
  .item--box {
    padding: var(--spacing-15);
  }
}
@media (min-width: 1920px) {
  .item--box {
    padding: 0.78125vw;
  }
}
.item--box .title {
  font-weight: var(--weight-5);
  font-size: var(--spacing-md);
  line-height: var(--spacing-18);
  margin-bottom: var(--spacing-10);
  color: var(--color-secondary);
}
@media (min-width: 1920px) {
  .item--box .title {
    font-size: 0.8333333333vw;
    line-height: 0.9375vw;
    margin-bottom: 0.5208333333vw;
  }
}
.item--box .content {
  font-size: var(--spacing-14);
  line-height: var(--spacing-md);
  margin-bottom: var(--spacing-17);
  color: var(--color-gray);
}
@media (min-width: 1920px) {
  .item--box .content {
    font-size: 0.7291666667vw;
    line-height: 0.8333333333vw;
    margin-bottom: 0.8854166667vw;
  }
}
.item--box .price {
  font-weight: var(--weight-5);
  font-size: var(--spacing-md);
  line-height: var(--spacing-18);
  color: var(--color-secondary);
}
@media (min-width: 1920px) {
  .item--box .price {
    font-size: 0.8333333333vw;
    line-height: 0.9375vw;
  }
}

.modal-dialog {
  max-width: 550px;
}
@media (min-width: 1920px) {
  .modal-dialog {
    max-width: 28.6458333333vw;
  }
}
.modal-dialog-sm {
  max-width: 380px;
}
@media (min-width: 1920px) {
  .modal-dialog-sm {
    max-width: 19.7916666667vw;
  }
}
.modal-content {
  background-color: var(--color-gray-light);
  padding: var(--spacing-20) var(--spacing-10) var(--spacing-20) var(--spacing-20);
}
@media (min-width: 768px) {
  .modal-content {
    padding: var(--spacing-30) var(--spacing-md) var(--spacing-30) var(--spacing-30);
  }
}
@media (min-width: 1920px) {
  .modal-content {
    padding: 1.5625vw 0.9375vw 1.5625vw 1.5625vw;
  }
}
.modal-body {
  max-height: calc(100dvh - 218px);
  overflow-x: var(--hidden);
  overflow-y: var(--auto);
}
@media (min-width: 576px) {
  .modal-body {
    max-height: calc(100dvh - 258px);
  }
}
@media (min-width: 768px) {
  .modal-body {
    max-height: calc(100dvh - 278px);
  }
}
@media (min-width: 1920px) {
  .modal-body {
    max-height: calc(100dvh - 12.7604166667vw);
  }
}
.modal-footer {
  justify-content: var(--unset);
}
.modal-footer .owl-nav {
  position: var(--absolute);
  top: var(--spacing--33);
  right: var(--spacing-0);
  font-size: var(--spacing-xl);
}
.modal-footer .owl-prev {
  margin-right: var(--spacing-10);
}

.item--card {
  cursor: var(--unset);
}
.item--img img {
  border-radius: var(--spacing-15);
}
.item--counter {
  font-size: var(--spacing-11);
  line-height: var(--spacing-12);
  color: var(--color-secondary-rgb50);
  min-width: var(--spacing-100);
}
@media (min-width: 1920px) {
  .item--counter {
    font-size: 0.625vw;
    line-height: 0.7291666667vw;
    min-width: 5.2083333333vw;
  }
}
.item--list-card {
  padding-top: var(--spacing-5);
  padding-bottom: var(--spacing-sm);
  border-bottom: var(--spacing-1) dashed var(--color-default);
}
@media (min-width: 1920px) {
  .item--list-card {
    padding-top: 0.2604166667vw;
    border-width: 0.0520833333vw;
    padding-bottom: 0.4166666667vw;
  }
}
.item--list--img {
  min-width: var(--spacing-54);
  height: var(--spacing-54);
}
@media (min-width: 1920px) {
  .item--list--img {
    min-width: 2.8125vw;
    height: 2.8125vw;
  }
}
.item--list--content {
  padding: var(--spacing-0) var(--spacing-sm);
}
@media (min-width: 768px) {
  .item--list--content {
    padding: var(--spacing-0) var(--spacing-10);
  }
}
@media (min-width: 1920px) {
  .item--list--content {
    padding: var(--spacing-0) 0.5208333333vw;
  }
}
.item--list--content .h1 {
  font-weight: var(--weight-4);
  color: var(--color-secondary);
  margin-bottom: var(--spacing-10);
}
@media (min-width: 1920px) {
  .item--list--content .h1 {
    margin-bottom: 0.5208333333vw;
  }
}
.item--list--content .price {
  font-size: var(--spacing-14);
  line-height: var(--spacing-md);
  font-weight: var(--weight-4);
  color: var(--color-secondary);
}
@media (min-width: 1920px) {
  .item--list--content .price {
    font-size: 0.7291666667vw;
    line-height: 0.8333333333vw;
  }
}
.item--list--content .itemName {
  font-size: var(--spacing-11);
  line-height: var(--spacing-12);
}
@media (min-width: 768px) {
  .item--list--content .itemName {
    font-size: var(--spacing-12);
    line-height: var(--spacing-14);
  }
}
@media (min-width: 1920px) {
  .item--list--content .itemName {
    font-size: 0.625vw;
    line-height: 0.7291666667vw;
  }
}

.qty--input {
  text-align: center;
  padding: var(--spacing-0) var(--spacing-5);
  border: var(--none);
  max-width: var(--spacing-xl);
  background-color: var(--color-transparent);
}
@media (min-width: 1920px) {
  .qty--input {
    padding: var(--spacing-0) 0.2604166667vw;
    max-width: 1.6666666667vw;
  }
}
.qty--input:focus, .qty--input:hover, .qty--input.active {
  outline: var(--unset);
  box-shadow: var(--unset);
}
.qty-btn-plus, .qty-btn-minus {
  background: var(--color-secondary);
  color: var(--color-white);
  font-size: var(--spacing-12);
  height: var(--spacing-20);
  width: var(--spacing-20);
  border-radius: var(--spacing-5);
  transition: 0.3s;
}
@media (min-width: 1920px) {
  .qty-btn-plus, .qty-btn-minus {
    font-size: 0.625vw;
    height: 1.0416666667vw;
    width: 1.0416666667vw;
    border-radius: 0.2604166667vw;
  }
}

.btn-close {
  z-index: 1;
  top: var(--spacing-10);
  right: var(--spacing-10);
  background: var(--none);
  font-size: var(--spacing-18);
  font-weight: var(--weight-9);
}
@media (min-width: 768px) {
  .btn-close {
    top: var(--spacing-10);
    right: var(--spacing-10);
  }
}
@media (min-width: 1920px) {
  .btn-close {
    top: 0.5208333333vw;
    right: 0.5208333333vw;
    font-size: 1.0416666667vw;
  }
}

#CartModal.modal.fade .modal-dialog {
  /* transform: translate(var(--spacing-0), var(--spacing-0)); */
  margin-right: -560px;
  transition: all 0.3s;
}
#CartModal.modal.show .modal-dialog {
  /* transform: translate(var(--spacing-0), var(--spacing-0)); */
  margin-right: var(--spacing-0);
  transition: all 0.3s;
}
#CartModal .modal-dialog {
  margin: var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--auto);
}
#CartModal .modal-content {
  border-radius: var(--spacing-20) var(--spacing-0) var(--spacing-0) var(--spacing-20);
}
@media (min-width: 1920px) {
  #CartModal .modal-content {
    border-radius: var(--spacing-20) var(--spacing-0) var(--spacing-0) var(--spacing-20);
  }
}
#CartModal .modal-body {
  max-height: calc(100dvh - 370px);
  min-height: calc(100dvh - 370px);
}
@media (min-width: 576px) {
  #CartModal .modal-body {
    max-height: calc(100dvh - 314px);
    min-height: calc(100dvh - 314px);
  }
}
@media (min-width: 768px) {
  #CartModal .modal-body {
    max-height: calc(100dvh - 328px);
    min-height: calc(100dvh - 328px);
  }
}
@media (min-width: 1200px) {
  #CartModal .modal-body {
    max-height: calc(100dvh - 344px);
    min-height: calc(100dvh - 344px);
  }
}
@media (min-width: 1920px) {
  #CartModal .modal-body {
    max-height: calc(100dvh - 18.6979166667vw);
    min-height: calc(100dvh - 18.6979166667vw);
  }
}
#CartModal .modal-body .item--list--content .itemName {
  font-size: var(--spacing-11);
  line-height: var(--spacing-12);
  color: var(--color-gray);
}
@media (min-width: 1920px) {
  #CartModal .modal-body .item--list--content .itemName {
    font-size: 0.625vw;
    line-height: 0.8333333333vw;
  }
}

.order-placed-ticket::before, .order-placed-ticket::after {
  content: "";
  position: var(--absolute);
  width: var(--spacing-xl);
  height: var(--spacing-xl);
  border-radius: var(--spacing-full);
  background: var(--color-white);
  top: -16px;
}
@media (min-width: 1700px) {
  .order-placed-ticket::before, .order-placed-ticket::after {
    width: var(--spacing-xxl);
    height: var(--spacing-xxl);
  }
}
@media (min-width: 1920px) {
  .order-placed-ticket::before, .order-placed-ticket::after {
    width: 2.5vw;
    height: 2.5vw;
    top: -1.25vw;
  }
}
.order-placed-ticket::before {
  left: -21px;
}
@media (min-width: 1700px) {
  .order-placed-ticket::before {
    left: -1.4583333333vw;
  }
}
@media (min-width: 1920px) {
  .order-placed-ticket::before {
    left: -1.4583333333vw;
  }
}
.order-placed-ticket::after {
  right: -21px;
}
@media (min-width: 1700px) {
  .order-placed-ticket::after {
    right: -1.4583333333vw;
  }
}
@media (min-width: 1920px) {
  .order-placed-ticket::after {
    right: -1.4583333333vw;
  }
}

#addmore {
  background: var(--color-black-rgb06);
}
#addmore:focus {
  background: var(--color-white);
  border-color: var(--color-secondary-rgb50);
}

.edit {
  right: var(--spacing-10);
}
@media (min-width: 1920px) {
  .edit {
    right: 0.5208333333vw;
  }
}/*# sourceMappingURL=index.css.map */