.tab-item {
  padding: 0px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 3rem;
  border: none!important;
}

.bottom-tab-item {
  padding: 0px;
  display: flex;
  width: 20%;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 100%;
}

.nav-pills .nav-link {
  background: #fff;
  color: #6c6c6c;
  width: 100%!important;
  border-radius: 0px;
  padding: 1.5rem 0;
  position: relative;
}

.category-box-image {
  display: flex;
  width: 3rem;
  height: 3rem;
  padding: 0.375rem;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 2.5rem;
  z-index: 2;
  top: 0.5rem;
}

.sub-category-icon-box {
  display: flex;
  width: 3rem;
  height: 3rem;
  padding: 0.375rem;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 2.5rem;
  z-index: 2;
  top: 0.5rem;
}

.tabbar-fixed {
  position: fixed;
  bottom: 0px;
  left: 0px;
  display: flex;
  background: #fff;
  padding: 0;
  width: 100%;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.bottom-tab-bar {
  position: fixed;
  bottom: 0px;
  display: flex;
  background: #fff;
  padding: 0 2.5rem;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  z-index: 10;
  max-width: 480px!important;
  border-top: 1px solid #f1f1f1;
}

.tab-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.rtl-style {
  direction: rtl;
  font-family: 'IRANSans';
  font-size: 15px;
  height: 100vh;
  width: 100vw;
  max-width: 480px;
  margin: 0 auto;
  position: relative;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #07c990!important;
  border-radius: 0;
  height: 100%;
  padding: 1.5rem 0;
  border-bottom: 4px solid #09d498;
  background: none!important;
}

.single-item-header-image {
  width: 100%;
}

.single-station-report-item-list {
  border-radius: 0;
  padding: 0;
  width: 100%;
  gap: 0.45rem;
  display: flex;
  flex-direction: column;
}

.cart-page-full-items-single {
  border-radius: 0;
  border-bottom: 1px dashed #efefef;
  background: #FFF;
  padding: 1rem 0;
  width: 100%;
}

.blog-page-list-container-item {
  border-radius: 0;
  border-bottom: 1px dashed #efefef;
  background: #FFF;
  padding: 1rem 0;
  width: 100%;
}

.common-problem-list-container-item {
  border-radius: 0;
  border-bottom: 1px dashed #efefef;
  background: #FFF;
  padding: 1rem 0;
  width: 100%;
}

.cart-item-single-box {
  border-radius: 0;
  border-bottom: 1px dashed #efefef;
  background: #FFF;
  padding: 1rem 0;
  width: 100%;
}

.single-station {
  border-radius: 0;
  border-bottom: 1px solid #efefef;
  background: #FFF;
  padding: 1.25rem 0;
}

.pinned-card {
  display: flex;
  flex-direction: column;
  border: 1px solid #efefef;
  background: #FFF;
  border-radius: 1rem;
  width: 100%;
}

.Pinned-card {
  border-radius: 1.25rem;
  border: 1px solid #F3F3F3;
  background: #FFF;
  box-shadow: 0px 24px 24px -20px rgba(0, 0, 0, 0.08);
  padding: 1.25rem 1rem;
  margin-bottom: 0.75rem;
}

.shop-tab-list {
  padding: 0;
  width: 100%;
}

.city-stations-list {
  padding: 5rem 0rem 0rem 0rem;
  width: 100%;
}

.stations-list {
  padding: 1rem 0rem 0rem 0rem;
  width: 100%;
}

.shop-cart-page {
  padding: 4.5rem 0rem 0rem 0rem;
  width: 100%;
}

.single-station-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  position: relative;
  width: 100%!important;
}

.single-post-header {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  align-content: center;
  position: relative;
  width: 100%!important;
  justify-content: space-between;
  gap: 1rem;
}

.pinned-card-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  align-content: center;
  position: relative;
  width: 100%!important;
  padding: 0 1rem;
}

.single-station-divider {
  color: #dadada;
}

.single-station-loc {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
}

.single-station-button-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  bottom: 0px;
  width: 100%;
  background: #fff;
  padding: 1rem 1.5rem 1.5rem 1.5rem;
}

.before-payment-float-button-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  bottom: 0px;
  width: 100%;
  background: #fff;
  padding: 0.5rem 1.5rem 1.5rem 1.5rem;
  z-index: 100;
  margin: 0 auto;
  max-width: 480px;
}

.checkout-float-button-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  bottom: 0px;
  width: 100%;
  background: #fff;
  padding: 0.5rem 1.5rem 1.5rem 1.5rem;
  z-index: 100;
  max-width: 480px;
}

.product-page-add-cart-float-button-box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  bottom: 0px;
  width: 100%;
  max-width: 480px;
  background: #fff;
  padding: 1rem 1.5rem 1.5rem 1.5rem;
  z-index: 100;
  gap: 0.5rem;
  border-top: 1px solid #e6e6e6;
}

.cart-float-button-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  bottom: 0px;
  width: 100%;
  background: #fff;
  padding: 1rem 1.5rem 1.5rem 1.5rem;
}

.pinned-card-button-box {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 0.5rem 1rem 1rem 1rem;
  border-radius: 0 0 1rem 1rem;
}

.report-button-box {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5rem;
}

.off-canvas-double-buttons {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.modal-upgrade-button-box {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.modal-register-button-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 10%;
}

.tab-link {
}

.badge-green {
  border-radius: 2.5rem;
  border: 1px solid #10E0A2;
  background: rgba(16, 224, 162, 0.14);
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #10E0A2;
}

.station-header-box-head-status-red {
  border-radius: 2.5rem;
  background: #EB3540;
  display: flex;
  padding: 0.45rem 0.75rem 0.45rem 0.75rem;
  justify-content: center;
  align-items: center;
  color: #fff;
}

.station-header-box-head-status-yellow {
  border-radius: 2.5rem;
  background: #f7b100;
  display: flex;
  padding: 0.45rem 0.75rem 0.45rem 0.75rem;
  justify-content: center;
  align-items: center;
  color: #fff;
}

.station-header-box-head-status-orange {
  border-radius: 2.5rem;
  background: #FD8630;
  display: flex;
  padding: 0.45rem 0.75rem 0.45rem 0.75rem;
  justify-content: center;
  align-items: center;
  color: #fff;
}

.station-header-box-head-status-green {
  border-radius: 2.5rem;
  background: #09D498;
  display: flex;
  padding: 0.45rem 0.75rem 0.45rem 0.75rem;
  justify-content: center;
  align-items: center;
  color: #fff;
}

.address-card-option-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
}

.success-payment-badge-green {
  border-radius: 2.5rem;
  border: 1px solid #10E0A2;
  background: rgba(16, 224, 162, 0.14);
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #10E0A2;
  position: absolute;
  left: 0;
}

.limit-payment-badge-green {
  border-radius: 2.5rem;
  border: 1px solid #F78B4F;
  background: rgba(224, 128, 16, 0.14);
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #F78B4F;
  position: absolute;
  left: 0;
}

.fail-payment-badge-green {
  border-radius: 2.5rem;
  border: 1px solid #F74F77;
  background: rgba(224, 16, 91, 0.14);
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #F74F77;
  position: absolute;
  left: 0;
}

.defaulte-badge {
  border-radius: 2.5rem;
  border: 1px solid #e4e4e4;
  background: rgb(248,248,248);
  display: flex;
  padding: 0.25rem 0.35rem 0.25rem 0.35rem;
  justify-content: center;
  align-items: center;
  color: #6d6d6d;
}

.station-header-box-head-status-lable {
  font-size: 13px;
  line-height: 12px;
  padding: 0px;
  margin: 0px;
  font-weight: 500;
}

.badge-lable {
  font-size: 12px;
  line-height: 12px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.checkout-address-description {
  font-size: 12px;
  line-height: 13px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-page-car-suggestion-container-single-car-text-container-description {
  font-size: 12px;
  line-height: 13px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  width: 100px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #6c6c6c;
}

.car-service-added-car-company {
  font-size: 12px;
  line-height: 13px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  width: 280px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

.blog-page-list-container-item-link-content-box-description {
  font-size: 12px;
  line-height: 13px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.address-description {
  font-size: 12px;
  line-height: 13px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.notification-time-item {
  font-size: 12px;
  line-height: 12px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  color: #6d6d6d;
}

.notification-item-text {
  font-size: 14px;
  line-height: 24px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  color: #6d6d6d;
}

.profile-card-phone {
  font-size: 14px;
  line-height: 12px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.ad-text {
  font-size: 14px;
  line-height: 24px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.replay-comment-text {
  font-size: 12px;
  line-height: 13px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.comment-time-value {
  font-size: 12px;
  line-height: 13px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  color: #6c6c6c;
  margin-top: 6px;
}

.transactions-time-value {
  font-size: 12px;
  line-height: 12px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.order-time-add-value {
  font-size: 12px;
  line-height: 22px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.card-head {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
}

.badge-orange {
  border-radius: 2.5rem;
  border: 1px solid #F78B4F;
  background: rgba(224, 128, 16, 0.14);
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #F78B4F;
}

.badge-yellow {
  border-radius: 2.5rem;
  border: 1px solid #f7b100;
  background: rgba(255,213,132,0.14);
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #f7b100;
}

.badge-red {
  border-radius: 2.5rem;
  border: 1px solid #F74F77;
  background: rgba(224, 16, 91, 0.14);
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #F74F77;
}

.card-loc-text {
  color: #6d6d6d;
  font-size: 12px;
  font-weight: 400;
  padding: 0px;
  margin: 0px;
  width: 160px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.single-post-list-des {
  color: #6d6d6d;
  font-size: 13px;
  font-weight: 400;
  padding: 0px;
  margin: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.primary-btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  border-radius: 2rem;
  color: #fff;
  background: #09D498;
  border: none;
  font-size: 0.85rem;
  font-weight: 500;
  padding: 0.35rem 0.5rem;
  height: 2rem;
}

.payment-primary-btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  border-radius: 2rem;
  color: #fff;
  background: #09D498;
  border: none;
  font-size: 0.85rem;
  font-weight: 500;
  padding: 0.65rem 1.5rem;
}

.btn:hover {
  color: #fff;
  background-color: #09D498;
  border-color: #09D498;
}

.off-canvas-delete-buttonhover {
  color: #fff;
  background-color: #09D498;
  border-color: #09D498;
}

.btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
  color: #fff;
  background-color: #09D498;
  border-color: #09D498;
}

.icon-btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 4rem;
  padding: 0px;
  color: #09d498;
  background: #EEF9F6;
  border: 1px solid #09d498;
}

.buttons-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.icon-btn:hover, .icon-btn:active {
  background: #EEF9F6!important;
  color: #09d498!important;
  border: 1px solid #09d498;
}

.modal-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  bottom: 20px;
  border-radius: 20px;
  background: rebeccapurple;
}

.btn-group {
  width: 100%;
  margin-bottom: 0px;
  padding: 0px;
  gap: 0.25rem;
}

.btn-group > .btn-group:not(:last-child) > .btn, .btn-group > .btn.dropdown-toggle-split:first-child, .btn-group > .btn:not(:last-child):not(.dropdown-toggle) {
  border-radius: 4rem;
  margin: 0px;
  padding: 0px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 30%;
  border: none;
  font-size: 13px;
  font-weight: 500;
  /*color: #09d498;*/
}

.submit-row-secondary, .submit-row-secondary:checked, .submit-row-secondary:active {
  width: 100%;
  background: #fff!important;
  border-radius: 0.75rem;
  font-size: 14px;
  font-weight: 500;
  padding: 0.75rem 1rem;
  color: #000!important;
  border: 1px solid #e4e4e4!important;
}

.product-page-add-cart-button {
  width: 50%;
  background: #09d498;
  border: none;
  border-radius: 0.75rem;
  font-size: 14px;
  font-weight: 500;
  padding: 0.85rem 1rem;
}

.submit-row {
  width: 100%;
  background: #09d498;
  border: none;
  border-radius: 0.75rem;
  font-size: 14px;
  font-weight: 500;
  padding: 0.85rem 1rem;
}

.modal-head {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.gap {
  margin-bottom: 1rem;
}

.form-content {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.body-text {
  margin: 0px;
  padding: 0px;
}

.btn-checked:checked, .btn-checked:active, btn-checked:select {
  background: #09d498!important;
  color: #ffffff!important;
}

.select-right {
  direction: rtl;
  font-size: 14px;
  font-weight: 400;
  border: 1px solid #e3eee6;
  background-color: #eef9f6;
  border-radius: 0.75rem;
  padding: 0.65rem 2rem 0.65rem 0.5rem;
}

.form-select:focus {
  outline: 0;
  box-shadow: none;
  border: 1px solid #e3eee6;
}

.new-simple-top-header {
  background: #ffffff;
  padding: 0.5rem 1rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  position: fixed;
  width: 100%;
  z-index: 10;
  border-bottom: 1px solid #f1f1f1;
  max-width: 480px!important;
}

.simple-top-header {
  background: #ffffff;
  padding: 1.1rem 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  position: fixed;
  width: 100%;
  z-index: 10;
  border-bottom: 1px solid #f1f1f1;
  max-width: 480px!important;
}

.settings-simple-top-header {
  background: #ffffff;
  padding: 1.1rem 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  z-index: 10;
  max-width: 480px!important;
  border-bottom: 1px solid #e6e6e6;
}

.product-top-header-container {
  background: #ffffff;
  padding: 0.5rem 1rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  z-index: 100;
  max-width: 480px!important;
  border-bottom: 1px solid #e6e6e6;
  position: fixed;
  top: 0px;
}

.home-page-top-header {
  background: #ffffff;
  padding: 1.1rem 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  z-index: 10;
  max-width: 480px!important;
}

.user-page-top-header {
  background: rgba(0,0,0,0.3);
  padding: 1.1rem 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  z-index: 10;
  max-width: 480px!important;
  position: absolute;
}

.date-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.25rem;
}

.black-icon {
  color: #4F4F4F;
}

.secondary-icon {
  color: #6d6d6d;
}

.page-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.blog-post-page-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: calc(100% - 4rem);
}

.two-side-icon-header-h1-style {
  font-size: 14px;
  margin: 0px;
  padding: 0px;
  width: 100%;
  text-align: center;
}

.header-h1-style {
  font-size: 14px;
  margin: 0px;
  padding: 0px;
  width: calc(100% - 48px);
  text-align: center;
}

.blog-post-header {
  font-size: 14px;
  margin: 0px;
  padding: 0px;
  width: 94%;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.home-page-top-header-user-text {
  font-size: 15px;
  margin: 0px;
  padding: 0px;
}

.main-icon {
  width: 1.5rem;
  height: 1.5rem;
}

.date {
  color: #9E9E9E;
  font-size: 12px;
  text-overflow: ellipsis;
  padding: 0px;
  margin: 0px;
}

.badge-grey {
  border-radius: 2.5rem;
  border: 1px solid #9e9e9e;
  background: rgba(198,198,198,0.14);
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #9e9e9e;
  gap: 0.25rem;
}

.city-list {
  padding: 0.5rem 1.5rem 6rem 1.5rem;
  gap: 0;
}

.city-name {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
}

.blog-post-name {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 1rem;
}

.city-image {
  width: 3rem;
  height: 3rem;
  border-radius: 0.75rem;
}

.blog-image {
  object-fit: cover;
  width: 4rem;
  height: 4rem;
  border-radius: 0.75rem;
}

.blog-image {
  width: 5rem;
  height: 5rem;
  border-radius: 0.5rem;
}

.home-page-top-header-img {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 10rem;
}

.station-page-box-content-user-message-box {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  width: calc(100% - 3.5rem);
  background: #f8f8f8;
  border-radius: 1.25rem;
  padding: 0.625rem 1rem;
}

.cart-page-full-items-single-content-box {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  width: calc(100% - 5.5rem);
}

.blog-page-list-container-item-link-content-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.3rem;
  width: calc(100% - 4.5rem);
}

.common-problem-list-container-item-link-content-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.3rem;
  width: calc(100% - 4.5rem);
}

.product-item-single-box-content {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  width: calc(100% - 5.5rem);
}

.city-content {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.single-blog-list-content {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: calc(100% - 6rem);
}

.user-loc-city-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
}

.blog-post-carousel-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.65rem;
  width: 100%;
}

.popular-card-city-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.65rem;
}

.setting-header-dark-icon, .setting-header-dark-icon:hover, .setting-header-dark-icon:active, .setting-header-dark-icon:visited {
  text-decoration: none;
  color: #fff;
}

.setting-header-icon, .setting-header-icon:hover, .setting-header-icon:active, .setting-header-icon:visited {
  text-decoration: none;
  color: #ffffff;
}

.city-card, .city-card:hover, .city-card:active, .city-card:visited {
  text-decoration: none;
  color: #000;
}

.station-head-icon, .station-head-icon:hover, .station-head-icon:active, .station-head-icon:visited {
  text-decoration: none;
  color: #ffffff;
}

.shop-carousel-cover-banner, .shop-carousel-cover-banner:hover, .shop-carousel-cover-banner:active, .shop-carousel-cover-banner:visited {
  text-decoration: none!important;
  color: #6d6d6d;
  position: relative;
  border: 0px;
}

.city-cover-card, .city-cover-card:hover, .city-cover-card:active, .city-cover-card:visited {
  text-decoration: none!important;
  color: #6d6d6d;
  position: relative;
  border: 1.25rem;
}

.stations-header {
  width: 100%;
  padding: 1.5rem 1.5rem 0 1.5rem;
}

.station-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.5rem;
}

.popular-section {
  padding: 1.5rem 1.5rem 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 0.75rem;
}

.form-control:focus, .form-control:visited {
  color: #212529;
  background-color: #fff;
  border-color: #09d498!important;
  outline: 0;
  box-shadow: 0 0 0 .15rem rgba(16,224,162,0.33);
}

.best-city-img {
  width: 4rem;
  height: 4rem;
  border-radius: 20.8rem;
  border: 1px solid #efefef;
}

.best-city-title {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #514d4d;
  text-align: center;
}

he {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.best-station {
  border-radius: 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgb(247,247,247);
  padding: 2rem 0.5rem;
  gap: 0.75rem;
}

.popular-station-ahwaz {
  border-radius: 1rem;
  border: 1px solid #F3F3F3;
  box-shadow: 0px 24px 24px -20px rgba(0, 0, 0, 0.08);
  height: 160px;
  display: flex;
  align-items: flex-end;
}

.pop-card-head {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #fff;
}

.user-loc-card-head {
  font-size: 18px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #fff;
}

.blog-carousel-content-heading {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  width: 100%;
}

.pop-card-des {
  color: #d6d6d6;
  font-size: 12px;
  font-weight: 400;
  text-overflow: ellipsis;
  padding: 0px;
  margin: 0px;
}

.user-loc-card-des {
  color: #d6d6d6;
  font-size: 14px;
  font-weight: 400;
  text-overflow: ellipsis;
  padding: 0px;
  margin: 0px;
}

.blog-carousel-content-dec {
  color: #d6d6d6;
  font-size: 14px;
  font-weight: 400;
  padding: 0px;
  margin: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  width: 100%;
}

.popular-station-mashhad {
  border-radius: 1rem;
  border: 1px solid #F3F3F3;
  box-shadow: 0px 24px 24px -20px rgba(0, 0, 0, 0.08);
  height: 180px;
  display: flex;
  align-items: flex-end;
}

.popular-station-tehran {
  border-radius: 1rem;
  border: 1px solid #F3F3F3;
  box-shadow: 0px 24px 24px -20px rgba(0, 0, 0, 0.08);
  height: 280px;
  display: flex;
  align-items: flex-end;
  width: 100%;
}

.station-header-box-content {
  height: 300px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  width: 100%;
  position: relative;
  border: #09d498;
  margin-top: -88px;
  z-index: -10;
}

.user-location-station {
  height: 400px;
  display: flex;
  align-items: flex-end;
  width: 100%;
  position: relative;
  border: 1rem;
}

.product-page-product-image-carousel-container {
  height: 260px;
  width: 100vw;
  max-width: 480px;
  display: flex;
  align-items: flex-end;
  position: relative;
  border: 1rem;
}

.shop-header-carousel-banner {
  height: 200px;
  display: flex;
  align-items: flex-end;
  width: 100%;
  position: relative;
  border: 1rem;
}

.popular-post-item-box {
  height: 240px !important;
  display: flex;
  align-items: flex-end;
  width: 100%;
  position: relative;
  border: 1rem;
}

.north-section {
  padding: 3rem 0.5rem 2.5rem 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  background: linear-gradient(180deg, #09D498 0%, #00B47E 100%);
  margin: 2rem 0;
  border-radius: 0;
  color: white;
}

.middle-header {
  width: 100%;
  padding: 1rem 1.5rem 1rem 1.5rem;
  display: flex;
  align-items: center;
}

.center-north-city {
  border-radius: 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgb(255,255,255);
  padding: 1.5rem 1rem;
  gap: 0.75rem;
  width: 8rem;
  box-shadow: 0px 44px 24px -20px rgba(58,58,58,0.17);
}

.middle-station-header {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
}

.best-section {
  padding: 0 1.5rem;
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.link-style {
  color: #09d498!important;
  text-align: right;
  font-size: .875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1rem;
  margin: 0px;
  text-decoration: none!important;
}

.back-html {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  z-index: -1;
  right: 0px;
  border-radius: 1rem;
  object-fit: cover;
}

.user-location-image {
object-fit: cover;
}

.product-page-product-carousel-img {
  position: relative;
  display: flex;
  flex-direction: row;
  z-index: -1;
  right: 0px;
  border-radius: 0;
  height: 100%;
  margin: 0 auto;
}

.shop-header-carousel-img {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  z-index: -1;
  right: 0px;
  border-radius: 0;
}

.user-location-img {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  z-index: -1;
  right: 0px;
  border-radius: 1rem;
}

.station-header-box-content-img {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  z-index: -10;
  right: 0px;
}

.station-content-box {
  max-width: 380px;
  position: absolute;
  width: calc(100vw - 6rem);
  height: 2.5rem;
  margin: 0 1.5rem 1.5rem 1.5rem;
}

.shop-header-carousel-overlay {
  position: absolute;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
  padding: 2rem 1.5rem 3rem 1.5rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 0;
  gap: 1rem;
}

.station-header-box-content-overlay {
  position: relative;
  padding: 2rem 1.5rem 3rem 1.5rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 65%);
  margin-top: -80px;
}

.user-loc-station-content-box {
  position: absolute;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
  padding: 6rem 1.5rem 3rem 1.5rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 0 0 1rem 1rem;
  gap: 1rem;
}

.popular-card-content-box {
  position: absolute;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
  padding: 4rem 1.5rem 1.5rem 1.5rem;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  border-radius: 0 0 1rem 1rem;
  gap: 1rem;
}

.form-sub-text {
  color: #6d6d6d;
  font-size: 14px;
  line-height: 170%;
  font-weight: 400;
  text-overflow: ellipsis;
  padding: 0px;
  margin: 0px;
  text-align: center;
  position: relative;
}

.form-head-text {
  font-size: 16px;
  font-weight: 600;
  margin: 0px;
  padding: 0px;
  margin-bottom: 0.875rem;
}

.register-image {
  width: 98px;
  margin-bottom: 1rem;
}

.form-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 90%;
}

.payment-details-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 90%;
}

.common-problem-list-container-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 1.5rem;
}

.before-payment-details-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 1.5rem;
}

.filter-form-box {
  width: 100%;
  gap: 0.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.form-box {
  width: 100%;
  gap: 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.login-form {
  width: 90%;
  gap: 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.form-style {
  border-radius: 1rem;
  border: 1px solid #E6E6E6;
  background: #FAFAFA;
  height: 3rem;
  padding: 0.875rem;
  font-size: 14px;
  text-align: right!important;
}

.otp-input {
  width: 2.75rem!important;
  text-align: center!important;
  font-size: 1rem!important;
}

#otp {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  position: relative;
  justify-content: center;
  direction: ltr;
}

.form-btn {
  border-radius: 0.75rem!important;
}

.div-margin {
  margin-top: 1rem;
}

.btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
  color: #ffffff;
  background-color: #09d498;
  border-color: none;
}

.btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
  color: #fff;
  background-color: #09d498;
  border-color: none;
}

.div-margin-2 {
  margin-top: 2rem!important;
}

.form-link-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1rem;
}

.link-style:hover, .link-style:actived, .link-style:check {
  color: #09d498!important;
  text-align: right;
  font-size: .875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1rem;
  margin: 0px;
  text-decoration: none!important;
}

.top-tabbar {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding-right: 0px!important;
  margin-top: -10px!important;
}

.product-page-features-details-single-item-detail-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  color: #212529;
  gap: 0.25rem;
}

.update-time {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0.25rem;
}

.transaction-price-box {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-end;
  color: #6d6d6d;
  gap: 0.25rem;
}

.product-page-add-cart-float-price-box {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-end;
  color: #212529;
  gap: 0.25rem;
}

.product-page-add-cart-fload-off-box {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-end;
  color: #d61d43;
  gap: 0.25rem;
  position: relative;
}

..pinned-card-details-update-box {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0.25rem;
}

.profile-card-phone-box {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  color: #ffffff;
  gap: 0.25rem;
}

.transactions-time {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0.25rem;
}

.single-station-details-box-description {
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: center;
  color: #4F4F4F;
  gap: 0.25rem;
  font-size: 18px;
}

.station-page-user-comment-user-name-box {
  display: flex;
  flex-direction: column;
  padding: 0;
  align-items: flex-start;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0;
}

.product-page-user-comment-header-name-box {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  align-items: flex-start;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0.35rem;
  font-size: 18px;
}

replay-comment-box {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0.25rem;
  font-size: 18px;
}

.product-page-features-details-single-item-title-box {
  border: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  color: #6d6d6d;
  font-size: 18px;
  width: 30%;
  padding: 1rem 0;
}

.product-page-delivery-box-content {
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0.5rem;
  font-size: 18px;
}

.order-time-add {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0.25rem;
  font-size: 18px;
}

.order-tracking-container-content {
  border: 0;
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  gap: 0.25rem;
}

.transactions-price {
  border-radius: 2.5rem;
  border: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  align-items: flex-end;
}

.station-title {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  width: calc(100% - 4rem);
}

.notification-item-head {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
}

.profile-content-title {
  display: flex;
  gap: 0.75rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.no-login-content-title {
  display: flex;
  gap: 0.75rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
}

.station-manager-box {
  display: flex;
  gap: 0.75rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #00d597;
  border-radius: 40px;
  padding: 0.5rem 0.8rem;
}

.empty-profile-content-title {
  display: flex;
  gap: 0.25rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.change-profile-content-title {
  display: flex;
  gap: 0.75rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.car-service-features-list-single-text-box {
  display: flex;
  gap: 0.45rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.product-page-car-suggestion-container-single-car-text-container {
  display: flex;
  gap: 0.45rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  width: 100%!important;
}

.car-service-added-car-card-text-box {
  display: flex;
  gap: 0.45rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.address-card-text-box {
  display: flex;
  gap: 0.45rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.order-card-text-box {
  display: flex;
  gap: 0.25rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 60%;
}

.single-station-report-box-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  gap: 1.5rem;
}

.cart-page-full-items {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.order-details-product-list-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.filter-details-product-list-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  overflow-x: overlay;
  position: relative;
  height: 60px;
  padding-right: 1.5rem;
  padding-left: 1.5rem;
}

.single-station-name-content-box {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.order-details-card-text-box-checkout {
  display: flex;
  gap: 0.45rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  margin-bottom: 8rem;
}

.product-page-user-comment-details-card {
  display: flex;
  gap: 1.5rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.car-service-user-car-details-card {
  display: flex;
  gap: 1rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.product-page-about-details-card {
  display: flex;
  gap: 1.5rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.product-page-features-details-card {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.product-page-user-suggestion-container-inner {
  display: flex;
  gap: 0.45rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.order-details-card-text-box {
  display: flex;
  gap: 0.45rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.connected-application-content-title {
  display: flex;
  gap: 0.65rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.comment-off-canvas-title {
  display: flex;
  gap: 0.65rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 90%;
  margin-bottom: 1rem;
}

.filter-off-canvas-title {
  display: flex;
  gap: 0.65rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 90%;
  margin-bottom: 1rem;
  margin-right: 1.5rem;
}

.off-canvas-title {
  display: flex;
  gap: 0.65rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 90%;
  margin-bottom: 1.5rem;
}

.transactions-title {
  display: flex;
  gap: 0.5rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.content-page {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 6rem 1.5rem 1.5rem 1.5rem;
  width: 100%;
}

.privacy-text {
  color: #9E9E9E;
  font-size: 15px;
  line-height: 170%;
  font-weight: 400;
  text-overflow: ellipsis;
  padding: 0px;
  margin: 0px;
}

.top-1 {
  margin-top: 0.5rem;
}

a {
  text-decoration: none!important;
  color: #000000;
}

.blog-page-list-container-item-link-content-box-title {
  font-size: 14px;
  line-height: 22px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  margin-bottom: 0.2rem;
}

.common-problem-list-container-item-link-content-box-title {
  font-size: 14px;
  line-height: 22px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  margin-bottom: 0.2rem;
}

.card-product-item-name {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 0.2rem;
}

.city-card-head {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 170px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.single-blog-list-heading {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  margin: 0px;
  padding: 0px;
  color: #000!important;
}

.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-bottom: 1.5rem;
  margin-top: 30%;
}

.empty-image {
  width: 112px;
  margin-bottom: 1rem;
}

.page-desc {
  color: #6d6d6d;
  font-size: 12px;
  font-weight: 400;
  padding: 0px;
  margin: 0px;
}

.single-station-home {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  position: relative;
  max-width: 382px;
}

.blog-carousel-content-box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  position: relative;
  width: 100%;
}

.main-container {
  padding: 1rem 1.5rem 5rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.profile-section {
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.profile-image {
  width: 100px;
  height: 100px;
  border-radius: 100px;
  border: 2px solid #ffffff;
  box-shadow: 0px 24px 44px -20px rgba(0,0,0,0.23);
}

.no-login-image {
  width: 80px;
  height: 80px;
  border-radius: 100px;
  border: 1px solid #f1f1f1;
  padding: 0.5rem;
  background: #fff;
}

.no-login-profile-image {
  width: 100px;
  height: 100px;
  border-radius: 100px;
  border: 2px solid #ffffff;
  box-shadow: 0px 24px 44px -20px rgba(0,0,0,0.23);
  background-color: #ffffff;
}

.change-profile-image {
  width: 70px;
  height: 70px;
  border-radius: 100px;
  border: 1px solid #dedede;
  box-shadow: 0px 24px 44px -20px rgba(0,0,0,0.23);
}

.connected-application-image {
  width: 48px;
  height: 48px;
  border-radius: 100px;
  border: 1px solid #eeeeee;
  box-shadow: 0px 24px 44px -20px rgba(0,0,0,0.23);
}

.profile-image-settings {
  width: 80px;
  height: 80px;
  border-radius: 100px;
}

.profile-section-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.5rem;
}

.profile-section-content-name {
  font-size: 18px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  margin-bottom: 0.25rem;
  color: #fff;
}

.settings-section {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #ffffff;
  width: 100%;
  height: auto;
  border-radius: 1rem;
  gap: 0.25rem;
}

.profile-container {
  padding: 2rem 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  border-radius: 1.5rem;
}

.settings-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  position: relative;
  gap: 0.75rem;
}

.settings-section-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  position: relative;
  width: 100%;
  padding: 0.25rem 0;
}

.settings-section-item-iconbox {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 44px;
  height: 44px;
  background: #f8f8f8;
}

.settings-section-item-title-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
}

.setting-item-text {
}

.setting-item-text {
  font-size: 14px;
  font-weight: 500;
  margin: 0;
  padding: 0;
  color: #000000;
}

.setting-section-icon {
  width: 24px;
  height: 23px;
  color: #6c6c6c;
}

.page-title:hover, .page-title:select, .page-title:clicked, .page-title:focus, .page-title:checked {
  color: #000!important;
}

.page-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  color: #000!important;
  gap: 0.5rem;
}

.main-container-inner-page {
  padding: 1rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.sms-settings-container-inner-page {
  padding: 5.5rem 1.5rem 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.car-settings-page-car-details-container {
  padding: 5.5rem 1.5rem 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.car-settings-page-container-inner-page {
  padding: 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.settings-container-inner-page {
  padding: 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.icon-btn-primary {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 4rem;
  padding: 0px;
  color: #fff;
  background: #09d498;
  border: 1px solid #09d498;
}

.float-btn {
  position: absolute;
  left: 0;
  border: 3px solid #fff!important;
}

.edit-profile-section {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.filter-type-items {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
}

.payment-type-items {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  width: 100%;
  margin-top: 1rem;
}

.checkout-delivery-address-type-items {
  display: grid;
  grid-template-columns: 50% 50%;
  margin-top: 1rem;
  gap: 0.5rem;
}

.delivery-type-items {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
  margin-top: 1rem;
}

.image-list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  width: 100%;
}

.order-type-items {
  display: grid;
  gap: 0.5rem;
}

.order-type-item-box {
  width: 70px;
  height: 70px;
  border-radius: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin-right: 300px;
}

.filter-type-item-container {
  width: 100px!important;
  padding: 0rem 0.5rem 0rem 0.5rem;
  height: auto;
  border-radius: 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.payment-type-item-container {
  width: calc(100% / 3)!important;
  padding: 1rem 0.5rem 0.5rem 0.5rem;
  height: auto;
  border-radius: 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  max-width: 480px;
}

.delivery-address-type-item-container {
  padding: 1rem;
  height: auto;
  border-radius: 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  gap: 0.5rem;
  width: calc((100vw - 3rem) / 2);
  max-width: calc((468px - 3rem) / 2);
}

.delivery-type-item-container {
  width: 100%!important;
  padding: 1rem 1.5rem;
  height: auto;
  border-radius: 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  max-width: 480px;
}

.image-item {
  width: 70px;
  height: 70px;
  border-radius: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

..delivery-type-item-radio {
  width: 70px;
  height: 70px;
  border-radius: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.order-type-item-container-img {
  position: absolute;
  width: 100%;
  height: 70px;
  z-index: 10;
}

.image-radio-item {
  position: absolute;
  width: 70px;
  height: 70px;
  z-index: 1;
}

.select-profile-image {
  position: relative;
  top: 1.5px;
  left: -10px;
  width: 68px;
  height: 68px;
  border-radius: 100px;
}

.form-check-input:focus {
  border-color: #09d498;
  outline: 0;
  box-shadow: none!important;
  color: #09d498!important;
}

.form-check-input:checked {
  background-color: rgba(255,255,255,0);
  border-color: #09d498;
  color: #09d498!important;
}

.order-type-item-container {
  vertical-align: top;
  background-color: rgba(255,255,255,0);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0;
  border: 3px solid rgb(222,222,222);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  border-radius: 12px;
  color-adjust: exact;
}

.form-check-input {
  margin-top: .25em;
  vertical-align: top;
  background-color: rgba(255,255,255,0);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0;
  border: 3px solid rgb(222,222,222);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-print-color-adjust: exact;
  color-adjust: exact;
  print-color-adjust: exact;
}

.profile-modal {
  overflow-x: scroll;
  height: 63vh;
  padding-bottom: 0px!important;
}

.modal-float-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 5rem;
  position: sticky;
  bottom: 0;
  left: 0;
  background: #ffffff;
  z-index: 2;
}

.report-icon-box-notavailable {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 48px;
  height: 48px;
  background-color: #fff2f2;
}

.notification-item-icon-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 48px;
  height: 48px;
  background-color: rgb(247,247,247);
}

.transactions-icon-box-notavailable {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
}

.report-icon-box-available {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 48px;
  height: 48px;
  background-color: #ecfbe7;
}

.transactions-icon-box-available {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
}

.report-icon-box-limit {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 48px;
  height: 48px;
  background-color: rgb(255,246,237);
}

.transactions-icon-box-limit {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
}

.report-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: calc(100% - 3rem);
  gap: 0.75rem;
  padding: 1rem 0;
  background: #fff;
  border-bottom: 1px solid #f5f5f5;
  position: relative;
}

.notification-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  width: 100%;
  gap: 0.75rem;
  padding: 1rem 1.5rem;
  background: #fff;
  border-bottom: 1px solid #f5f5f5;
  position: relative;
}

.transactions-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  border-bottom: 1px solid #f5f5f5;
  width: 100%;
  padding: 1.25rem;
  border-radius: 1rem;
  background: #fff;
  border: 1px solid #e5e5e5;
}

.transaction-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
  padding: 1rem 1.5rem;
  background: #fff;
  border-bottom: 1px solid #f5f5f5;
}

.reports-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.transactions-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 5.5rem 1.5rem 2rem 1.5rem;
  gap: 0.5rem;
}

.payment-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
  padding: 0;
  margin-bottom: 1rem;
}

.single-report-container {
  border: 1px solid #efefef;
  width: 100%;
  padding: 1.25rem;
  border-radius: 1rem;
  background: #ffffff;
}

.payment-details-row-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  gap: 1rem;
}

.before-payment-details-row-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
}

.payment-details-row {
  display: flex;
  gap: 0.5rem;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.payment-details-value {
  font-size: 18px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #000000;
}

.transaction-report-details-value {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #000000;
}

.transactions-value {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #000000;
}

.payment-card-head {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.transactions-number {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.settings-header-text {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  position: relative;
  width: 80%;
  text-align: center;
  color: #fff;
}

.top-nav-tab-bat-title {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  text-align: center;
  color: #000000;
}

.report-title {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 240px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.notification-item-title {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 280px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-name {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 170px;
  white-space: nowrap;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
}

.no-login-name {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
}

.setting-user-name {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 170px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.station-page-name {
  font-size: 17px;
  font-weight: 600;
  margin: 0px;
  padding: 0px;
  width: 430px;
  white-space: nowrap;
  overflow: hidden;
  line-height: 28px;
  text-overflow: ellipsis;
}

.filter-type-item-content-tile {
  font-size: 13px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 100%;
}

.delivery-tipe-item-content-tile {
  font-size: 13px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 100%;
  text-align: center;
}

.checkout-address-title {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-page-car-suggestion-container-single-car-text-container-name {
  font-size: 13px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  position: relative;
  width: 100px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-page-car-suggestion-container-single-car-text-container-name-all {
  font-size: 13px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.car-service-added-car-name {
  font-size: 16px;
  font-weight: 600;
  margin: 0px;
  padding: 0px;
  width: 280px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

.car-service-add-car-empty-state-container-text {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #fff;
}

.car-settings-page-delete-car-button-text {
  font-size: 13px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #eb3540;
}

.address-name {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.connected-application-name {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 170px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ad-title {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 240px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.add-title {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 240px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

a:hover {
  color: #000!important;
}

.list-text-default {
  font-size: 14px;
  line-height: 14px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.transaction-modal {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  padding-top: 3rem;
}

.transaction-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.transaction-report-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.off-canvas-text-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 1rem;
  margin-bottom: 2rem;
}

.modal-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 1rem;
  margin-bottom: 2rem;
}

.car-service-state-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-bottom: 1rem;
}

.empty-state-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-bottom: 1rem;
}

.transaction-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}

.transaction-plan-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
}

.profile-card-name {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  position: relative;
}

.no-login-card-name {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
  position: relative;
  width: 100%;
}

.car-service-added-car-card-content-text-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  position: relative;
  width: 100%;
  padding: 0.5rem 0 0.5rem 0;
}

.car-service-added-car-card-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  position: relative;
  width: 100%;
  padding: 1rem 0 0.5rem 0;
}

.app-card-name {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  position: relative;
}

.setting-profile-card-name {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  position: relative;
}

.transaction-plan-title {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #fff;
}

.payment-status {
  font-size: 16px;
  font-weight: 600;
  margin: 0px;
  padding: 0px;
  margin-bottom: 0.25rem;
}

.modal-head-title {
  font-size: 16px;
  font-weight: 600;
  margin: 0px;
  padding: 0px;
  margin-bottom: 0.25rem;
}

.empty-state-head-title {
  font-size: 13px;
  font-weight: 600;
  margin: 0px;
  padding: 0px;
  margin-bottom: 0.25rem;
}

.transaction-plan-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 40px;
  height: 40px;
  background: #fff;
}

.transaction-plan-icon {
  width: 32px;
  height: 32px;
}

.badge-yellow-fill {
  border-radius: 2.5rem;
  background: #d61d43;
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #ffffff;
}

.transaction-details-body {
  width: 100%;
  padding: 1.25rem;
  border-radius: 1rem;
  background: #f7f7f7;
}

.transaction-plan-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border-radius: 1rem;
  background: linear-gradient(22deg, #eb0a40 43.36%, #ff5c83 99.21%);
}

.profile-card-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  justify-content: center;
  width: 100%;
  gap: 0.5rem;
  padding: 2.5rem 1rem;
  border-radius: 1rem;
  background: linear-gradient(22deg, #07c990 43.36%, #48ffc8 99.21%);
  color: #fff;
  background-image: url("../../assets/img/assets/images/profile%20img.svg");
}

.connected-application-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
  padding: 1rem 1rem;
  border-radius: 1rem;
  border: 1px solid #e4e4e4;
}

.change-profile-image-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
  padding: 1rem;
  border-radius: 1rem;
  border: 1px solid #e6e6e6;
}

a:visited, a:focus {
  box-shadow: none!important;
}

.submit-row-secondary:hover {
  background: #f7f7f7!important;
  border: 1px solid #cccccc!important;
}

.transaction-sub-text {
  color: #6d6d6d;
  font-size: 13px;
  line-height: 170%;
  font-weight: 400;
  padding: 0px;
  margin: 0px;
  text-align: center;
}

.empty-state-sub-text {
  color: #6d6d6d;
  font-size: 13px;
  line-height: 170%;
  font-weight: 400;
  padding: 0px;
  margin: 0px;
  text-align: center;
}

.modal-head-subtext {
  color: #6d6d6d;
  font-size: 13px;
  line-height: 170%;
  font-weight: 400;
  padding: 0px;
  margin: 0px;
  text-align: center;
}

.plans-top-active {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
  padding: 1rem;
  border-radius: 1rem;
  background: linear-gradient(22deg, #eb0a40 43.36%, #ff5c83 99.21%);
  color: white;
}

.plans-top-active-img-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 50px;
  height: 50px;
  background: #ffffff;
}

.plans-top-active-content {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.plans-top-active-badge {
  border-radius: 2.5rem;
  background: #ffffff;
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #c60024;
}

.plans-plan-card {
  width: 100%;
  padding: 1.25rem;
  border-radius: 1rem;
  background: #fff;
  border: 1px solid #e5e5e5;
}

.plans-plan-card-badge {
  border-radius: 2.5rem;
  background: #09d498;
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #ffffff;
}

.active-plans-plan-card-badge {
  border-radius: 2.5rem;
  background: #cd0031;
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #ffffff;
  position: absolute;
  left: 16px;
  top: 16px;
}

.profile-active-plans-plan-card-badge {
  border-radius: 2.5rem;
  background: #08b582;
  display: flex;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  justify-content: center;
  align-items: center;
  color: #ffffff;
  position: absolute;
  left: 16px;
  top: 16px;
}

.section-header {
  width: 100%;
  padding: 2rem 0rem 0.5rem 0rem;
  display: flex;
  align-items: center;
}

.section-gap {
  margin-top: 1rem;
}

.plans-plan-card-img-box1 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 44px;
  height: 44px;
  background: #ffefef;
}

.plans-plan-card-img {
  width: 28px;
  height: 28px;
}

.plans-plan-card-content-subtext {
  font-size: 12px;
  line-height: 12px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  color: #6d6d6d;
}

.plans-top-active-title {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.plans-plan-card-content-title {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.plans-plan-card-price-section {
  padding: 1rem 0;
  border-top: 1px dashed #d3d3d3;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.before-plans-plan-card-price-section {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.transaction-price-section {
  padding: 1rem 0 0 0;
  border-top: 1px dashed #d3d3d3;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.plans-plan-card-price-title {
  font-size: 13px;
  font-weight: 600;
  margin: 0px;
  padding: 0px;
}

.subtotal-cart-price-value {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  text-align: left;
  color: #212529;
}

.order-card-price-value {
  font-size: 16px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  text-align: left;
  color: #212529;
}

.plans-plan-card-price-value {
  font-size: 18px;
  font-weight: 600;
  margin: 0px;
  padding: 0px;
  text-align: left;
  color: #000;
}

.features-icon {
  color: #09d498;
  width: 18px;
  height: 18px;
}

.plans-card-details-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.25rem;
}

.plans-plan-card-feature-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
}

.plans-plan-card-img-box2 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 44px;
  height: 44px;
  background: #e8f5d7;
}

.plans-plan-card-img-box3 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 44px;
  height: 44px;
  background: #f2e7ff;
}

.center-content {
  margin-top: 20%;
}

.other-login-ways {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 90%;
}

.form-message-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.login-form-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 1rem;
}

.telegram-login {
}

.content-page-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 1rem 0 2rem 0;
}

.content-page-block {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 0.25rem;
  align-items: center;
}

.content-page-block-heading {
  font-size: 14px;
  font-weight: 600;
  color: #000;
  width: 100%;
}

.blog-post-heading {
  font-size: 17px;
  font-weight: 600;
  color: #000;
  width: 100%;
}

.content-page-block-text {
  color: #514d4d;
  font-size: 14px;
  line-height: 180%;
  font-weight: 400;
  padding: 0px;
  width: 100%;
  margin: 0px;
}

.content-page-block-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  gap: 0.5rem;
  color: #514d4d;
}

.content-page-block-list-item {
  font-size: 14px;
  color: #514d4d;
  padding: 0px;
  margin: 0px;
}

.inner-gap-3 {
  padding-bottom: 3rem;
}

.content-page-block-list-icon {
  color: #09d498;
  width: 18px;
  height: 20px;
}

.content-page-block-list-row {
  display: flex;
  flex-direction: row;
  padding: 0;
  align-items: flex-start;
  justify-content: flex-start;
  color: #6d6d6d;
  gap: 0.5rem;
}

.content-page-block-image {
  border-radius: 16px;
  width: 100%;
  height: auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border: 1px solid #efefef;
  margin: 0.5rem 0;
}

.content-page-block-info-box {
  display: flex;
  flex-direction: row;
  padding: 1rem;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.5rem;
  background: #fff7db;
  border-radius: 1rem;
  width: 100%;
}

.content-page-block-info-text {
  font-size: 13px;
  color: #603a00;
  padding: 0px;
  margin: 0px;
  line-height: 180%;
}

.error-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 30%;
  gap: 1rem;
}

.payment-report-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 30%;
  gap: 3rem;
}

.cart-page-full {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  height: calc(100vh - 3rem);
  padding: 7rem 1.5rem 2rem 1.5rem;
}

.product-page-product-image-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4rem 1.5rem 0.5rem 1.5rem;
}

.product-page-user-comment-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem;
  border-bottom: 1px solid #efefef;
}

.car-service-user-car-other-product-section-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 1.5rem 1.5rem 2rem 1.5rem;
  position: relative;
  gap: 1rem;
  width: 100%;
  max-width: 480px;
}

.car-service-user-car-features-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem 1.5rem 2rem 1.5rem;
  position: relative;
}

.product-page-features-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem 1.5rem 1rem 1.5rem;
  position: relative;
}

.product-page-key-feature-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem 1.5rem 1rem 1.5rem;
}

.product-page-product-rate-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0rem 1.5rem 1rem 1.5rem;
}

.product-page-notic-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 1.5rem 1.5rem 1.5rem 1.5rem;
  background: rgba(241,210,102,0.18);
  border-bottom: 1px solid #e6e6e6;
}

.product-page-car-suggestion-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  background: #fff;
  gap: 1rem;
}

.product-page-user-suggestion-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 0 1.5rem 1rem 1.5rem;
  background: #fff;
}

.product-page-waranty-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 1.5rem;
  background: #fff;
  border-top: 1px solid #efefef;
  border-bottom: 1px solid #efefef;
}

.blog-page-list-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 4.5rem 1.5rem 2rem 1.5rem;
  position: relative;
}

.common-problem-list-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 4.5rem 1.5rem 2rem 1.5rem;
  position: relative;
}

.search-shop-page-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 4.5rem 1.5rem 2rem 1.5rem;
  position: relative;
}

.category-list-page-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem 2rem 1.5rem;
  position: relative;
}

.checkout-payment-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  height: calc(100% - 52px);
  padding: 5rem 1.5rem 2rem 1.5rem;
}

.before-payment-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  height: calc(100% - 52px);
  padding: 5.5rem 1.5rem 2rem 1.5rem;
}

textarea.form-control {
  min-height: calc(8.5em + .75rem + 2px);
}

.report-message-input {
  border-radius: 12px;
  border: 1px solid #E6E6E6!important;
  background: #fff;
  padding: 0.65rem 0.75rem;
  font-size: 14px;
  text-align: right!important;
  width: 100%;
  margin-bottom: 1rem;
}

.pelak-form-left-input-style {
  border-radius: 0;
  border: none;
  background: #fff;
  padding: 0.35rem 0 0 0;
  font-size: 40px;
  text-align: center;
  font-weight: 600;
  letter-spacing: 6px;
  width: 25%;
}

.pelak-form-city-code-input-style {
  border-radius: 0;
  border: none;
  background: #fff;
  padding: 0!important;
  font-size: 36px;
  text-align: center;
  font-weight: 600;
  letter-spacing: 6px;
  width: 100%;
  height: 48px;
  font-family: 'IRANSans';
  line-height: 48px;
}

.pelak-form-input-style {
  border-radius: 0;
  border: none;
  background: #fff;
  padding: 0.35rem 0 0 0;
  font-size: 40px;
  text-align: center;
  font-weight: 600;
  letter-spacing: 6px;
  width: 35%;
}

.pelak-form-select-style {
  border-radius: 0;
  border: none!important;
  background: #fff;
  padding: 0.35rem 0;
  font-size: 40px;
  text-align: center;
  line-height: 56px;
  font-weight: 600;
  margin-top: -2px;
  width: 10%;
}

.input-style {
  border-radius: 12px;
  border: 1px solid #E6E6E6!important;
  background: #fff;
  padding: 0.65rem 0.75rem;
  font-size: 14px;
  text-align: right!important;
}

.comment-title-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 0;
}

.input-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  gap: 0;
}

.discount-input-row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  width: 100%;
  gap: 0.5rem;
}

.input-row-form-label {
  color: #6c6c6c;
  margin-bottom: 2px;
}

.btn-second {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 2rem;
  border-radius: 4rem;
  color: #09d498;
  background: #EEF9F6;
  border: 1px solid #09d498;
  padding: 0.35rem 0.5rem;
  font-size: 0.85rem;
  font-weight: 500;
}

.multi-input-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  gap: 1.5rem;
}

.settings-icon {
  width: 24px;
  height: 24px;
}

.settings-header {
  padding: 1rem 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: start;
  gap: 0.5rem;
  position: relative;
  width: 100%;
  z-index: 10;
}

.plans-header-container {
  padding: 5.5rem 1.5rem 0rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin-top: 0;
}

.general-header-container {
  padding: 5rem 2.5rem 3rem 2.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  background: linear-gradient(22deg, #07c990 43.36%, #48ffc8 99.21%);
  margin-top: -3.5rem;
}

.blog-post-img-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  background: #fff;
  padding-bottom: 1rem;
}

.profile-section-content-num {
  color: #defff3;
  font-size: 16px;
  line-height: 140%;
  font-weight: 400;
  text-overflow: ellipsis;
  padding: 0px;
  margin: 0px;
  text-align: center;
  position: relative;
}

.plans-header-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 1rem;
  background: linear-gradient(22deg, #eb0a40 43.36%, #ff5c83 99.21%);
  border-radius: 1rem;
  padding: 3rem 1rem;
  position: relative;
}

.plans-header-free {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 1rem;
  background: rgba(9,212,152,0.08);
  border-radius: 1rem;
  padding: 1rem;
  border: 1px solid #09d498;
}

.general-header-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 1rem;
}

.plans-header-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.85rem;
  color: #fff;
}

.general-header-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.75rem;
  color: #fff;
}

.plans-heder-image {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 90px;
  height: 90px;
  background: rgb(255,255,255);
}

.general-header-image {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 90px;
  height: 90px;
  background: rgb(255,255,255);
}

.plan-header-icon {
  width: 60px;
  height: 60px;
}

.general-header-icon {
  width: 60px;
  height: 60px;
}

.reports-header-icon {
  width: 60px;
  height: 60px;
}

.plans-header-title {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
}

.plans-header-free-title {
  font-size: 13px;
  font-weight: 400;
  line-height: 24px;
  margin: 0px;
  padding: 0px;
  color: #05845f;
}

.general-header-title {
  font-size: 15px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
}

.plan-header-time {
  font-size: 12px;
  line-height: 12px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.general-header-time {
  font-size: 12px;
  line-height: 12px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.new-full-main-container {
  padding: 4rem 0 2rem 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0rem;
}

.full-main-container {
  padding: 1rem 0 2rem 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0rem;
}

.reports-header-container {
  padding: 4rem 0 0 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
}

.profile-header-container {
  padding: 4rem 2.5rem 3rem 2.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  background: linear-gradient(22deg, #07c990 43.36%, #48ffc8 99.21%);
}

.reports-header-title {
  font-size: 18px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  color: #fff;
  gap: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.reports-header-content {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 2rem;
  padding: 2rem 0;
  background: linear-gradient(52deg, #eb0a40 43.36%, #ff5c83 99.21%);
}

.profile-header-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 2rem;
}

.reports-header-counter {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: #fff;
  gap: 0.5rem;
}

.reports-header-counter-list {
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.reports-counter {
  font-size: 18px;
  padding: 0px;
  margin: 0px;
}

.reports-counter-status {
  font-size: 13px;
  padding: 0px;
  margin: 0px;
}

.reports-header-counter-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: #fff;
  padding: 0 1.5rem;
  border-right: 1px solid rgba(255,255,255,0.33);
  border-left: 1px solid rgba(255,255,255,0.33);
}

.reports-header-title {
}

.plans-header-title-text {
  font-size: 15px;
}

.reports-header-title-text {
  font-size: 15px;
}

.add-address-link, .add-address-link:hover, .add-address-link:visited, .add-address-link:focus {
  font-size: 14px;
  font-weight: 400;
  color: #000!important;
  border: none!important;
  box-shadow: none!important;
}

.profile-change-image, .profile-change-image:hover, .profile-change-image:visited, .profile-change-image:focus {
  font-size: 14px;
  font-weight: 400;
  color: #6d6d6d!important;
}

.reports-header-image {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 90px;
  height: 90px;
  background: rgb(255,255,255);
}

.profile-header-image {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  width: 90px;
  height: 90px;
  background: rgb(255,255,255);
}

.settings-header-dark {
  padding: 1rem 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  position: relative;
  width: 100%;
  z-index: 10;
  background: linear-gradient(22deg, #07c990 43.36%, #48ffc8 99.21%);
}

.top-nav-tab-bar {
  padding: 1.5rem 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  position: relative;
  width: 100%;
  z-index: 10;
  background: #fff;
  border-bottom: 1px solid #f5f5f5;
  margin-top: -1rem!important;
}

.top-nav-search-bar {
  padding: 1.5rem 1.5rem 0 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  position: relative;
  width: 100%;
  z-index: 10;
  background: #fff;
  margin-top: -1rem!important;
}

.order-right-side {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  width: 100%;
  position: relative;
}

.transaction-right-side {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  width: 100%;
  position: relative;
}

.transaction-report-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.25rem;
}

.off-canvas-text-box-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.25rem;
  width: 90%;
}

.modal-head-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.25rem;
  width: 90%;
}

.empty-state-head-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.25rem;
  width: 90%;
}

.profile-header-edit {
  color: #fff;
  gap: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.profile-card-section {
  padding: 1rem 1.5rem 0 1.5rem;
}

.settings-card-section {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem;
}

.station-status-message-box-yellow {
  display: flex;
  flex-direction: column;
  padding: 1rem 1.5rem;
  color: #fff;
  background: #f7b100;
  font-size: 14px;
  font-weight: 400;
}

.pinned-card-message-box-orange {
  display: flex;
  flex-direction: column;
  padding: 0.5rem 1rem;
  color: #fff;
  background: #FC4C40;
  font-size: 14px;
  font-weight: 400;
  margin-bottom: -0.75rem;
  width: 100%;
}

.station-status-message-box-orange {
  display: flex;
  flex-direction: column;
  padding: 1rem 1.5rem;
  color: #fff;
  background: #FD8630;
  font-size: 14px;
  font-weight: 400;
}

.station-status-message-box-red {
  display: flex;
  flex-direction: column;
  padding: 1rem 1.5rem;
  color: #fff;
  background: #EB3540;
  font-size: 14px;
  font-weight: 400;
}

.station-status-message-box-green {
  display: flex;
  flex-direction: column;
  padding: 1rem 1.5rem;
  color: #fff;
  background: #09D498;
  font-size: 14px;
  font-weight: 400;
}

.single-station-report-box {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem 1.5rem 2rem 1.5rem;
}

.order-details-page-section {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem 1.5rem 2rem 1.5rem;
}

.station-title-box {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 0 1.5rem 1.25rem 1.5rem;
  z-index: 999;
  margin-top: -40px;
}

.car-service-car-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem 1.5rem 0.5rem 1.5rem;
}

.car-service-features-list {
  display: flex;
  flex-direction: column;
  padding: 1rem 1.5rem;
}

.car-service-car-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 0.5rem 1.5rem 1rem 1.5rem;
}

.address-page-main-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 5.5rem 1.5rem 1.5rem 1.5rem;
}

.orders-page-main-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 5.5rem 1.5rem 1.5rem 1.5rem;
}

.change-profile-image-card-section {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 5.5rem 1.5rem 1.5rem 1.5rem;
}

.connected-application-card-section {
  padding: 1.5rem;
}

.ad-box {
  padding: 0 1.5rem;
  margin-top: 1rem;
}

.user-location-box {
  padding: 0 1.5rem 0.5rem 1.5rem;
}

.station-header-box {
  padding: 0;
}

.shop-header-carousel {
  padding: 0 0 1rem 0;
}

.blog-popular-posts-box {
  padding: 1rem 1.5rem 1.5rem 1.5rem;
}

.ad-box-card {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  color: #fff;
  padding: 0;
  background-image: url("../../assets/img/pro-plan.svg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 100%;
  border-radius: 1rem;
  position: relative;
}

.icon-nav-style {
  width: 1.5rem!important;
  height: 1.5rem!important;
}

.tab-pointer {
  background: #09d498;
  width: 6px;
  height: 6px;
  border-radius: 100px;
  margin-top: 8px;
}

.tab-pointer.deactive {
  opacity: 0;
}

.pinned-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin: 0;
  gap: 0.75rem;
  padding: 1rem 1.5rem 6rem 1.5rem;
}

.button-icon-light {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 1.4rem;
  width: 1.4rem;
  border-radius: 4rem;
  background: #ffffff;
  border: none;
  padding: 0;
}

.pin-button-icon {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 1.4rem;
  width: 1.4rem;
  border-radius: 4rem;
  background: #09d498;
  border: none;
  padding: 0;
}

.pinned-icon-active {
  width: 1.2rem;
  height: 1.2rem;
  color: #fff;
}

.pinned-icon-default {
  width: 1.2rem;
  height: 1.2rem;
  color: #bcbcbc;
}

.button-icon-light:hover, .button-icon-light:active, .button-icon-light:checked {
  background: #fff!important;
  border: none;
  box-shadow: none;
}

.pinned-card-left-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.15rem;
}

.pinned-card-benzin-type {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.25rem;
}

.subtotal-box-cart {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem;
  padding: 0;
  width: 100%!important;
  position: relative;
}

.subtotal-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem;
  padding: 1rem 0 0 0;
  border-top: 1px dashed #e8e8e8;
  width: 100%!important;
  position: relative;
}

.order-report-card-details-total {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem;
  padding: 1rem 0 0 0;
  border-top: 1px dashed #e8e8e8;
  width: 100%!important;
  position: relative;
}

.order-report-singel-card-details-total {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem;
  padding: 1rem 0 0 0;
  border-top: 1px dashed #e8e8e8;
  width: 100%!important;
  position: relative;
}

.order-report-card-details {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem;
  padding: 1rem 0 0 0;
  border-top: 1px dashed #e8e8e8;
  width: 100%!important;
  position: relative;
}

.order-report-card-details-extra {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 1rem 0 0 0;
  border-top: 1px dashed #e8e8e8;
  width: 100%!important;
  position: relative;
}

.pinned-card-details {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 1rem;
  border-top: 1px dashed #e8e8e8;
  width: 100%!important;
  position: relative;
}

.login-page {
  padding: 2rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 80%;
  gap: 1.5rem;
}

.input-style.login-phone-input {
  text-align: center!important;
  font-size: 16px!important;
  letter-spacing: 2px;
  height: 3rem;
  padding: 0!important;
}

.input-style.otp-input {
  text-align: center!important;
  font-size: 16px!important;
  letter-spacing: 6px;
  height: 3rem;
  padding: 0!important;
  width: 100%!important;
}

.login-form-divider {
  color: #c3c3c3;
  margin: 0;
  position: absolute;
  width: 100%;
}

.form-divider {
  color: #e6e6e6;
  margin: 0;
  width: 100%;
  opacity: 1!important;
}

.form-divider {
  color: #e6e6e6;
  margin: 0;
  width: 100%;
  opacity: 1!important;
}

.dashed-comment-divider {
  margin: 0;
  width: 100%;
  opacity: 1!important;
  border: 1px dashed #efefef;
}

.solid-comment-divider {
  margin: 0;
  width: 100%;
  opacity: 1!important;
  color: #efefef;
}

.login-form-divider-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 90%;
  position: relative;
}

.replay-comment-divider-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  position: relative;
  padding: 0.5rem 0;
}

.comment-divider-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  position: relative;
  padding: 1rem 0;
}

.form-divider-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  position: relative;
  padding: 0.5rem 0;
}

.login-form-divider-text-box {
  background: #fff;
  padding: 0 0.5rem;
  z-index: 1;
}

.full-row-fill-green {
  width: 100%;
  background: #09d498;
  border: none;
  border-radius: 0.75rem;
  font-size: 14px;
  font-weight: 500;
  padding: 0.85rem 1rem;
}

.user-loc-button {
  background: #ffffff;
  color: #000000;
  border: none;
  border-radius: 10rem;
  font-size: 13px;
  font-weight: 500;
  padding: 0.65rem 1.5rem;
}

.telegram-login-button {
  width: 100%;
  background: #0088cc;
  border: none;
  border-radius: 0.75rem;
  font-size: 14px;
  font-weight: 500;
  padding: 0.85rem 1rem;
  color: #fff;
}

.telegram-login-button:hover {
  background: #0076b1!important;
}

.full-row-fill-green:hover {
  background: #07bf89;
}

.timer-box {
  margin-top: 1rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
}

.resend-otp-link {
  color: #09d498;
  font-size: 14px;
  font-weight: 500;
}

.resend-otp-link:hover, .resend-otp-link:active, .resend-otp-link:checked, .resend-otp-link:focus {
  color: #09d498!important;
}

.subtotal-cart-price-label {
  margin: 0px;
  padding: 0px;
  line-height: 15px;
  font-size: 13px;
  font-weight: 500;
  width: 148px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.blog-page-list-container-item-link-content-box-time-box-text {
  margin: 0px;
  padding: 0px;
  line-height: 15px;
  font-size: 13px;
  width: 148px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pinned-card-details-box-text-value {
  margin: 0px;
  padding: 0px;
  line-height: 15px;
  font-size: 13px;
  font-weight: 500;
}

.pinned-card-details-box-text {
  margin: 0px;
  padding: 0px;
  line-height: 15px;
  font-size: 13px;
  font-weight: 500;
}

.blog-page-list-container-item-link-content-box-time-box-icon {
  width: 18px;
  height: 18px;
}

.pinned-card-details-update-icon {
  width: 1rem;
  height: 1rem;
}

.blog-page-list-container-item-link-content-box-time-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.25rem;
  color: #6d6d6d;
  width: 50%;
}

.pinned-card-details-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.25rem;
  color: var(--main-text-primary, #11171F);
}

.pinned-card-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.25rem 0rem 0rem 0rem;
  gap: 0.75rem;
}

.single-station-report-button {
  width: 48%;
  background: #09d498;
  border: 1px solid #09d498;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  padding: 0.75rem;
}

.pinned-card-button {
  width: 49%;
  background: #09d498;
  border: 1px solid #09d498;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  padding: 0.65rem 0.5rem;
}

.no-login-card-button {
  width: 120px;
  background: #09d498;
  border: 1px solid #09d498;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  padding: 0.5rem;
}

.notif-body-button {
  background: #09d498;
  border: 1px solid #09d498;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  padding: 0.35rem 0.5rem;
  width: 36%;
}

.single-station-navigation-button {
  width: 48%;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  padding: 0.75rem;
  border: 1px solid #09d498;
  color: #09d498;
  background: rgb(252,255,254);
}

.pinned-card-button-line {
  width: 48%;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  padding: 0.65rem 0.5rem;
  border: 1.5px solid #4F5654;
  color: #4F5654;
  background: rgb(252,255,254);
}

.no-login-button-line {
  width: 80%;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  padding: 0.5rem;
  border: 1px solid #09d498;
  color: #09d498;
  background: rgb(252,255,254);
}

.single-station-navigation-button:hover, .single-station-navigation-button:active, .single-station-navigation-button:checked, .single-station-navigation-buttone:focus {
  color: #09d498!important;
  background: rgb(252,255,254)!important;
}

.pinned-card-button-line:hover, .pinned-card-button-line:active, .pinned-card-button-line:checked, .pinned-card-button-line:focus {
  color: #4F5654!important;
  background: rgb(252,255,254)!important;
  border: 1.5px solid #4F5654!important;
}

., bottom-modal {
  display: none;
  position: fixed;
  z-index: 10;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background: rgba(0, 0, 0, 0.50);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  -webkit-animation-name: fadeIn;
  -webkit-animation-duration: 0.4s;
  animation-name: fadeIn;
  animation-duration: 0.4s;
}

., bottom-modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 90%;
}

.bottom-modal-content {
  background-color: #fefefe;
  padding: 3rem 1.5rem 1.5rem 1.5rem;
  width: 100%;
  border-radius: 1.5rem 1.5rem 0 0;
  margin: 0 auto;
  position: fixed;
  bottom: 0;
  left: 0;
  -webkit-animation-name: slideIn;
  -webkit-animation-duration: 0.4s;
  animation-name: slideIn;
  animation-duration: 0.4s;
}

.shop-body-box {
  padding: 12rem 1.5rem 1.5rem 1.5rem;
  width: 100%;
  margin: 0 auto;
}

.pinned-empty-state-box {
  padding: 6rem 1.5rem 1.5rem 1.5rem;
  width: 100%;
  margin: 0 auto;
}

.insurance-offcanvas-image {
  width: 160px;
  height: 160px;
}

.modal-image {
  width: 100px;
  height: 100px;
}

.report-button-limit {
  height: 9rem;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #fbf9e7;
  border: none;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: #6c4a17;
  width: 49%;
  padding-top: 4rem;
  position: relative;
}

.report-button-available {
  height: 9rem;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #ecfbe7;
  border: none;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: #176C3A;
  width: 49%;
  padding-top: 4rem;
  position: relative;
}

.off-canvas-cancel-button {
  height: 3rem;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #ffffff;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: var(--bs-dark);
  width: 100%;
  position: relative;
  border: 1px solid #b4b4b4;
}

.off-canvas-delete-button {
  height: 3rem;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #fff5f5;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: #fb0d0d;
  width: 100%;
  position: relative;
  border: 1px solid #ffcfd5;
}

.modal-upgrade-button {
  height: 3rem;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: linear-gradient(148deg, #09d498 10.48%, #00b37f 71.92%);
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  width: 16rem;
  position: relative;
  border: 1px solid #00b47e;
}

.report-button-not-available {
  height: 9rem;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #fff2f2;
  border: none;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: #a3001d;
  width: 49%;
  padding-top: 4rem;
  position: relative;
}

.report-button-limited {
  height: 9rem;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: rgb(255,246,237);
  border: none;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: #ae4a00;
  width: 49%;
  padding-top: 4rem;
  position: relative;
}

.report-button-img {
  width: 44px;
  height: 44px;
  position: absolute;
  top: 32px;
}

.upgrade-button-img {
  width: 28px;
  height: 28px;
  position: absolute;
  right: 12px;
}

.close {
  position: absolute;
  width: 32px;
  height: 32px;
  border-radius: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  left: 16px;
  top: 16px;
}

.modal-close-icon {
  width: 20px;
  height: 20px;
}

.report-button-limited:hover, .report-button-limited:active, .report-button-limited:checked, .report-button-limited:focus {
  background: rgb(255,241,227)!important;
  color: #ae4a00!important;
}

.report-button-not-available:hover, .report-button-not-available:active, .report-button-not-available:checked, .report-button-not-available:focus {
  background: #ffeaea!important;
  color: #a3001d!important;
}

.report-button-limit:hover, .report-button-limit:active, .report-button-limit:checked, .report-button-limit:focus {
  background: #f9f3dd!important;
  color: #6c4a17!important;
}

.report-button-available:hover, .report-button-available:active, .report-button-available:checked, .report-button-available:focus {
  background: #e5f9dd!important;
  color: #176C3A!important;
}

.contact {
  width: 10%;
  height: 50px;
  margin: 20px;
  background-color: #CCC;
  display: inline-block;
  text-align: center;
  padding-top: 10px;
  color: black;
  box-shadow: 4px 4px 8px 0px black;
  border: 2px ridge black;
}

#myInput {
  width: 100%;
}

#myUL {
  padding: 1.5rem 1.5rem 6rem 1.5rem!important;
  list-style-type: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  position: relative;
}

.shop-search-page-search-input {
  font-size: 14px!important;
  height: 2.5rem;
  border-radius: 0.875rem;
  border: none;
  padding: 0 1rem;
  width: 88%;
}

.dynamic-search-input {
  font-size: 14px!important;
  height: 3rem;
  border-radius: 0.875rem;
  border: 1px solid #e6e6e6;
  padding: 0 2.5rem 0 1rem;
}

.search-input-icon {
  width: 1.5rem;
  height: 1.5rem;
  position: absolute;
  right: 36px;
}

.shop-search-page-search-input:focus, .shop-search-page-search-input:visited {
  color: #212529;
  background-color: #fff;
  outline: 0;
  box-shadow: none!important;
}

.dynamic-search-input:focus, .dynamic-search-input:visited {
  color: #212529;
  background-color: #fff;
  border-color: #09d498!important;
  outline: 0;
  box-shadow: 0 0 0 .15rem rgba(16,224,162,0.33);
}

.list-item-single {
  margin: 0!important;
  padding: 0!important;
  width: 100%;
}

@keyframes slideIn {
  from {
    bottom: 2200px;
    opacity: 0;
  }
  to {
    bottom: 0px;
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.up-close {
  position: absolute;
  width: 32px;
  height: 32px;
  border-radius: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  left: 16px;
  top: 16px;
}

.modal-cta-image {
  width: 200px;
  height: 200px;
}

.empty-state-image {
  width: 140px;
  height: 140px;
}

.nav-pills {
  --bs-nav-pills-border-radius: 0.375rem;
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: #09d498;
}

.tab-item-top {
  width: 26%!important;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.shop-tab-item-top {
  width: 44%!important;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.tab-link {
  width: 100%!important;
}

.top-tab-link {
  width: 100%!important;
  font-weight: 500;
  padding: 1rem 0 !important;
}

.plan-header-card-active-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.setting-section-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.setting-section-header-icon {
  width: 1.25rem;
  height: 1.25rem;
}

.certificates-box {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
}

.certificates-box-single {
  width: 48%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 180px;
}

.middle-header-text {
  font-size: 15px;
  font-weight: 600;
  margin: 0;
}

.home-page-top-header-content {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.home-page-top-header-img-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border: 1px solid #e8e8e8;
  border-radius: 100px;
}

.user-city-loc-img-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 100px;
  background: #09d498;
}

.home-page-top-header-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.home-page-header-notif-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  position: relative;
}

.margin-bottom {
  margin-bottom: 2rem;
}

.ad-box-card:hover, .ad-box-card:focus, .ad-box-card:active, .ad-box-card:visited {
  color: #fff!important;
}

.home-main-ad-image-lg {
  width: 100%;
  height: 100%;
  border-radius: 1rem;
}

.transactions-item-status-img {
  border-radius: 100px;
}

.bs-custom-modal-body {
  background-color: #fefefe;
  padding: 3rem 1.5rem 1.5rem 1.5rem;
  width: 100%;
  border-radius: 1.5rem 1.5rem 0 0;
  margin: 0 auto;
  position: fixed;
  bottom: 0;
  left: 0;
  -webkit-animation-name: slideIn;
  -webkit-animation-duration: 0.4s;
  animation-name: slideIn;
  animation-duration: 0.4s;
  max-width: 540px;
}

.modal {
  --bs-modal-width: 500px;
  --bs-modal-padding: 1.5rem;
  --bs-modal-margin: 1rem;
  --bs-modal-bg: #fff;
  --bs-modal-border-color: var(--bs-border-color-translucent);
  --bs-modal-border-width: 0;
  --bs-modal-border-radius: 1.25rem;
  --bs-modal-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-modal-inner-border-radius: calc(0.5rem - 1px);
  --bs-modal-header-padding-x: 1rem;
  --bs-modal-header-padding-y: 1rem;
  --bs-modal-header-padding: 1rem 1rem;
  --bs-modal-header-border-color: var(--bs-border-color);
  --bs-modal-header-border-width: 1px;
  --bs-modal-title-line-height: 1.5;
  --bs-modal-footer-gap: 0.5rem;
  --bs-modal-footer-border-color: var(--bs-border-color);
  --bs-modal-footer-border-width: 1px;
  top: 0px;
  left: 0;
  z-index: var(--bs-modal-zindex);
  display: none;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
  position: fixed!important;
  left: 0!important;
  bottom: 0;
  overflow: auto;
  background: rgba(0, 0, 0, 0.50);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  -webkit-animation-name: fadeIn!important;
  -webkit-animation-duration: 0.2s!important;
  animation-name: fadeIn!important;
  animation-duration: 0.2s!important;
  width: 100%!important;
  align-items: center;
}

@media (min-width: 540px) {
  .bs-custom-modal-body {
    left: auto;
    border-radius: 1.5rem;
    bottom: 30%;
    padding: 3rem 1.5rem;
  }
}

.notification-item-content {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
  width: calc(100% - 60px);
}

.new-notif {
}

.new-notification {
  background: #fbfbfb;
}

.offcanvas-body {
  flex-grow: 1;
  padding: 3rem 1.5rem 1.5rem 1.5rem;
  position: relative;
}

.offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl {
  --bs-offcanvas-zindex: 1045;
  --bs-offcanvas-width: 400px;
  --bs-offcanvas-height: auto;
  --bs-offcanvas-padding-x: 1rem;
  --bs-offcanvas-padding-y: 1rem;
  --bs-offcanvas-bg: #fff;
  --bs-offcanvas-border-width: 1px;
  --bs-offcanvas-border-color: var(--bs-border-color-translucent);
  --bs-offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  border-radius: 1.5rem 1.5rem 0 0;
}

@media (min-width: 540px) {
  .offcanvas {
    border-radius: 1.5rem;
    bottom: calc((100vh - 60vh) / 2);
    padding: 1.5rem 1.5rem;
    width: 480px;
    margin: 0 auto;
    max-height: 60vh!important;
  }
}

@media (min-width: 540px) {
  .offcanvas-body {
    padding: 0;
  }
}

@media (min-width: 1200px) {
  .modal-float-button {
    border-radius: 0 0 1.5rem 1.5rem;
    padding: 1rem 1.5rem 0rem 1.5rem;
    position: sticky;
    bottom: 0px;
  }
}

@media (min-width: 540px) {
  .transaction-report-head {
    margin-top: 1.5rem;
  }
}

.link-button, .link-button:active, .link-button:hover, .link-button:focus, .link-button:checked {
  color: #fff!important;
}

.transaction-right-side-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.user-loc-button:hover, .user-loc-button:active, .user-loc-button:checked, .user-loc-button:focus {
  background: #f5f5f5!important;
  color: #000000!important;
}

.toast {
  position: absolute;
  bottom: 0;
  margin: 0 20px 20px 20px;
  --bs-toast-zindex: 1090;
  --bs-toast-padding-x: 1rem;
  --bs-toast-padding-y: 1rem;
  --bs-toast-spacing: 0;
  --bs-toast-max-width: 90%;
  --bs-toast-font-size: 0.875rem;
  --bs-toast-bg: #000;
  --bs-toast-border-width: 1px;
  --bs-toast-border-color: none;
  --bs-toast-border-radius: 0.5rem;
  --bs-toast-box-shadow: 0px 11px 12px 0px rgba(0, 0, 0, 0.45);
  --bs-toast-header-color: none;
  --bs-toast-header-bg: none;
  --bs-toast-header-border-color: none;
  width: var(--bs-toast-max-width);
  max-width: 440px;
  font-size: var(--bs-toast-font-size);
  color: #fff;
  pointer-events: auto;
  background-color: var(--bs-toast-bg);
  background-clip: padding-box;
  border: var(--bs-toast-border-width) solid var(--bs-toast-border-color);
  box-shadow: var(--bs-toast-box-shadow);
  border-radius: 1rem;
  z-index: 999999;
}

.toast-icon {
  width: 28px;
  height: 28px;
}

.toast-body {
  padding: var(--bs-toast-padding-x);
  word-wrap: break-word;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0.5rem;
}

.toast-text {
  padding: 0px;
  margin: 0px;
  font-size: 13px;
  line-height: 26px;
}

.primary-btn:hover, .btn-primary:active, .btn-primary:checked, .btn-primary:focus {
  color: #fff;
}

.payment-primary-btn:hover, .payment-primary-btn:checked, .payment-primary-btn:active, .payment-primary-btn:focus {
  color: #fff!important;
}

.discount-input {
  text-align: center!important;
  text-transform: uppercase!important;
  width: 240px!important;
  position: relative;
  letter-spacing: 4px;
  font-size: 16px;
  height: 3rem;
}

.submit-row-secondary:hover, .submit-row-secondary:focus, .submit-row-secondary:active, .submit-row-secondary:checked {
  color: #000000!important;
}

.pinned-card-button-line:hover, .pinned-card-button-line:focus, .pinned-card-button-line:active, .pinned-card-button-line:checked {
  color: #4F5654!important;
}

.blog-post-img {
  object-fit: cover;
  width: 100%;
  height: 220px;
}

.filter-notif-badge {
  background: #ff003d;
  width: 12px;
  height: 12px;
  border-radius: 10px;
  border: 3px solid #fff;
  position: absolute;
  top: 10px;
  left: 22px;
}

.notif-badge {
  background: #ff003d;
  width: 12px;
  height: 12px;
  border-radius: 10px;
  border: 3px solid #fff;
  position: absolute;
  top: 10px;
}

.city-card.top-city-card {
  position: relative;
}

.no-login-button-line:hover, .no-login-button-line:checked, .no-login-button-line:active, .no-login-button-line:click {
  background-color: #ffffff;
  color: #09d498;
}

.no-login-button-line:hover, .no-login-button-line:checked, .no-login-button-line:active, .no-login-button-line:clicked {
  background-color: #ffffff!important;
  color: #09d498!important;
}

.product-page-carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: center!important;
  padding: 0;
  margin-right: 86%!important;
  margin-bottom: 0.75rem;
  margin-left: 6%;
  list-style: none;
}

.shop-carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: center!important;
  padding: 0;
  margin-right: 6%;
  margin-bottom: 0.75rem;
  margin-left: 6%;
  list-style: none;
}

.carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: flex-start;
  padding: 0;
  margin-right: 6%;
  margin-bottom: 0.75rem;
  margin-left: 6%;
  list-style: none;
}

.product-page-carousel-indicators [data-bs-target] {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 3px;
  height: 3px;
  padding: 0;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #000!important;
  background-clip: padding-box;
  border: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  opacity: .5;
  transition: opacity .6s ease;
}

.carousel-indicators [data-bs-target] {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 3px;
  height: 3px;
  padding: 0;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #fff;
  background-clip: padding-box;
  border: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  opacity: .5;
  transition: opacity .6s ease;
}

.carousel-indicators .active {
  opacity: 1;
  width: 8px;
}

.offcanvas.offcanvas-bottom {
  right: 0;
  left: 0;
  height: var(--bs-offcanvas-height);
  max-height: 96%;
  border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
  transform: translateY(100%);
}

.order-type-container {
  position: relative;
  overflow: scroll;
  width: 100%;
}

.img-prof-list {
  position: relative;
  overflow: scroll;
}

.no-login-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  justify-content: center;
  width: 100%;
  gap: 0.5rem;
  padding: 1.5rem 2rem;
  border-radius: 1rem;
  color: #000000;
  border: 1px solid #e6e6e6;
}

.add-address-offcanvas {
  padding-top: 2rem!important;
}

.category-list-offcanvas-body {
  padding: 2rem 0rem 1.5rem 0rem!important;
}

.filter-offcanvas-body {
  padding: 2rem 0rem 1.5rem 0rem!important;
}

.comment-offcanvas-body {
  padding: 2rem 1.5rem 1.5rem 1.5rem!important;
}

.profile-img-offcanvas {
  padding-bottom: 0;
}

.car-service-features-list-single {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  width: 33%;
  padding: 0;
  border-radius: 1rem;
  gap: 0.5rem;
}

.address-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1.5rem 1rem;
  border-radius: 1rem;
  border: 1px solid #e4e4e4;
}

.car-service-added-car-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  padding: 1.5rem 1rem 1rem 1rem;
  border-radius: 1rem;
  border: 1px solid #efefef;
  gap: 0.75rem;
  background: #fff;
}

.form-row-inputs {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
}

.car-service-features-list-all {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  background: #f7f7f7;
  border-radius: 1rem;
  padding: 1rem 0.5rem;
}

.address-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.address-title {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.filter-type-item-content-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  width: 100%;
}

.payment-type-item-content-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  width: 100%;
}

.delivery-type-item-content-box {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}

.product-page-user-comment-img-box {
  display: flex;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  justify-content: center;
  align-items: center;
  border-radius: 5rem;
  background: #f8f8f8;
  border: 1px solid #eeeeee;
}

.station-page-box-content-user-img-box {
  display: flex;
  width: 3.24rem;
  height: 3.25rem;
  padding: 0;
  justify-content: center;
  align-items: center;
  border-radius: 5rem;
  background: #f8f8f8;
  border: 1px solid #eeeeee;
}

.blog-page-list-container-item-link-img-box {
  display: flex;
  width: 4.5rem;
  height: 4.5rem;
  padding: 0;
  justify-content: center;
  align-items: center;
  border-radius: 0.75rem;
  background: #00d597;
}

.common-problem-list-container-item-link-img-box {
  display: flex;
  width: 3.5rem;
  height: 3.5rem;
  padding: 0;
  justify-content: center;
  align-items: center;
  border-radius: 0.75rem;
  background: #f7f7f7;
}

.cart-product-item-img-box {
  display: flex;
  width: 4.5rem;
  height: 4.5rem;
  padding: 0;
  justify-content: center;
  align-items: center;
  border-radius: 0.75rem;
  background: #f8f8f8;
  object-fit: cover;
  /*border: 1px solid #eeeeee;*/
}

.car-service-features-list-single-img-box {
  display: flex;
  width: 3.5rem;
  height: 3.5rem;
  padding: 0.5rem;
  justify-content: center;
  align-items: center;
  border-radius: 5.5rem;
  background: #fff;
}

.delivery-type-item-content-icon-box {
  display: flex;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0.5rem;
  justify-content: center;
  align-items: center;
}

.address-icon-box {
  display: flex;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0.5rem;
  justify-content: center;
  align-items: center;
  border-radius: 5.5rem;
  background: var(--Green, #09D498);
}

.address-card-option-button-single {
  display: flex;
  width: 1.875rem;
  height: 1.875rem;
  padding: 0.375rem;
  justify-content: center;
  align-items: center;
  border-radius: 2.5rem;
  background: #f8f8f8;
}

.car-settings-page-remove-car-container {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}

.add-address-link-content {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.car-settings-page-delete-car-icon-box {
  display: flex;
  width: 1.875rem;
  height: 1.875rem;
  padding: 0.375rem;
  justify-content: center;
  align-items: center;
  border-radius: 2.5rem;
  background: #fff3f3;
}

.add-address-icon-box {
  display: flex;
  width: 1.875rem;
  height: 1.875rem;
  padding: 0.375rem;
  justify-content: center;
  align-items: center;
  border-radius: 2.5rem;
  background: #f8f8f8;
}

.car-settings-page-delete-car-icon {
  font-size: 18px;
  color: #eb3540;
}

.add-address-icon {
  font-size: 18px;
}

.off-canvas-cancel-button:hover {
  background: #f8f8f8!important;
  color: var(--bs-dark)!important;
  border: 1px solid #c8c8c8!important;
}

.off-canvas-delete-button:hover {
  background: #ffe2e2!important;
  color: #fb0d0d!important;
  border: 1px solid #ffcfd5!important;
}

.order-details-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.station-status-message-box-text {
  font-size: 13px;
  line-height: 22px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.product-page-key-feature-container-text {
  font-size: 13px;
  line-height: 22px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.product-page-about-content-paragraph {
  font-size: 13px;
  line-height: 22px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  margin-bottom: 0.5rem;
}

.station-page-box-content-user-message-box-text {
  font-size: 13px;
  line-height: 20px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.station-single-date {
  font-size: 14px;
  line-height: 18px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  text-overflow: ellipsis;
}

.station-single-address {
  font-size: 14px;
  line-height: 18px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  width: 240px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-page-user-comment-user-box-name-text {
  font-size: 13px;
  line-height: 1.2rem;
  padding: 0px;
  margin: 0px;
  font-weight: 500;
  color: #212529;
}

.product-page-user-comment-header-name {
  font-size: 13px;
  line-height: 14px;
  padding: 0px;
  margin: 0px;
  font-weight: 500;
  color: #212529;
}

.product-page-features-details-single-item-title {
  font-size: 12px;
  line-height: 20px;
  padding: 0px;
  margin: 0px;
  font-weight: 500;
  width: 26vw;
  max-width: 132px;
  color: #6c6c6c;
}

.product-page-delivery-box-content-text {
  font-size: 12px;
  line-height: 14px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.order-time-add-value {
  font-size: 13px;
  line-height: 14px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.cart-page-full-price-value {
  font-size: 15px;
  line-height: 15px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  color: #212529;
}

.product-page-features-details-single-item-detail {
  font-size: 12px;
  line-height: 20px;
  padding: 0px;
  margin: 0px;
  font-weight: 500;
  color: #212529;
  width: 58vw;
  max-width: 290px;
}

.product-page-add-cart-float-price-box-value {
  font-size: 18px;
  line-height: 16px;
  padding: 0px;
  margin: 0px;
  font-weight: 500;
}

.order-sub-price-value {
  font-size: 14px;
  line-height: 14px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
}

.category-page-item-price-off-value {
  font-size: 14px;
  line-height: 14px;
  padding: 0px;
  margin: 0px;
  font-weight: 400;
  color: #d61d43;
}

.station-header- {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.station-header-box-head {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1.5rem;
  position: relative;
  z-index: 1;
}

.cart-page-full-content-details-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 0.2rem;
}

.filter-details-box-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0 1.5rem;
}

.product-page-features-details-single-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  width: calc(100vw - 3rem);
  max-width: 432px;
  padding: 1rem 0;
  border-bottom: 1px dashed #e8e8e8;
}

.product-page-about-box-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

product-page-user-suggestion-container-user {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.product-page-delivery-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.order-details-box-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  position: relative;
}

.toman-svg {
  width: 20px;
}

.blog-page-list-container-item-link-img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 0.75rem;
}

.cart-product-item-img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 0.75rem;
}

.product-page-user-comment-rating-container-user {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0 0 0.5rem 0;
  border-radius: 0.75rem;
}

.station-page-user-comment-header-container {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.product-page-user-comment-header-container-user {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.station-page-user-comment-user-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
}

.product-page-user-comment-header-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
}

.station-page-box-content-user {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0.5rem;
}

.cart-page-full-items-single-content {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
}

.blog-page-list-container-item-link {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0.75rem;
}

.common-problem-list-container-item-link {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
}

.product-item-single-box-content-title {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
}

.station-single-call-button {
  display: flex;
  width: 2rem;
  height: 2rem;
  padding: 0;
  justify-content: center;
  align-items: center;
  border-radius: 5.5rem;
  background: rgba(255,255,255,0.3);
}

.station-header-box-head-icon {
  display: flex;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0.5rem;
  justify-content: center;
  align-items: center;
  border-radius: 5.5rem;
  background: rgba(0, 0, 0, 0.30);
}

.station-single-report-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0.75rem 1.5rem 2rem 1.5rem;
  justify-content: center;
  width: 100%;
}

.station-single-report-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0.75rem 1.5rem 2rem 1.5rem;
  justify-content: center;
  background: #ffffff;
  bottom: 0px;
  position: fixed;
  width: 100%;
}

.map-view {
  border-radius: 1rem;
  border: 1px solid #e6e6e6;
  margin-top: 1rem;
}

.report-message-input:focus {
  outline: 0;
  border: 1px solid #09d498!important;
  box-shadow: 0px 0px 0px 2px rgba(9,212,152,0.17)!important;
}

.shop-home-brands-list-container {
  display: grid;
  grid-template-columns: 20% 20% 20% 20%;
  padding: 0.5rem 1rem;
  justify-content: space-between;
  margin-top: 0.75rem;
  border-radius: 1rem;
  overflow: hidden;
  row-gap: 1rem;
  background: #f8f8f8;
}

.offcanvas-share-container {
  display: grid;
  grid-template-columns: 23% 23% 23% 23%;
  gap: 8px;
  margin: 0 auto;
  padding: 0 1.5rem;
  justify-content: center;
  max-width: 480px;
}

.offcanvas-all-suggested-cars-container {
  display: grid;
  grid-template-columns: 50% 50%;
  gap: 8px;
  margin: 0 auto;
  padding: 0 1.5rem;
  justify-content: center;
  max-width: 480px;
}

.shop-home-offcanvas-category-container {
  display: grid;
  grid-template-columns: 32% 32% 32%;
  gap: 8px;
  margin: 0 auto;
  padding: 0 1.5rem 0.75rem 1.5rem;
  justify-content: center;
  max-width: 480px;
}

.car-service-user-car-category-container {
  display: grid;
  grid-template-columns: 32% 32% 32%;
  gap: 8px;
  margin: 0 auto;
  justify-content: center;
  max-width: 480px;
  width: 100%;
}

.car-service-category-container {
  display: grid;
  grid-template-columns: 32% 32% 32%;
  gap: 8px;
  margin: 0 auto;
  padding: 1rem 1.5rem 1.5rem 1.5rem;
  justify-content: center;
  max-width: 480px;
}

.shop-home-category-container {
  display: grid;
  grid-template-columns: 20% 21% 21% 21%;
  gap: 8px;
  justify-content: center;
  padding-bottom: 1.75rem;
  padding-top: 0.75rem;
}

.main-page-category-section-items {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  padding-right: 1.25rem;
  padding-left: 1.25rem;
  height: 84px;
  gap: 0.25rem;
  overflow: overlay;
}

.shop-home-brand-item-single-img-box {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.offcanvas-share-item-single-img-box {
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  padding: 0.5rem 0.5rem;
  gap: 0.5rem;
}

.car-service-page-user-car-feature-item-single-box {
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: linear-gradient(194deg, #00da9b 25.48%, #00966a 82.99%);
  padding: 1.5rem 0.5rem;
  gap: 0.5rem;
}

.shop-home-offcanvas-category-item-single-img-box {
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #f7f7f7;
  padding: 1.5rem 0.5rem;
  gap: 0.5rem;
}

.shop-home-category-item-single-img-box {
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: rgba(186,186,186,0.07);
  padding: 1rem 0.1rem;
  gap: 0.5rem;
}

.shop-home-brand-items-single {
  height: 84px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.15rem;
}

.shop-home-category-items-single {
  width: 94px;
  height: 84px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.15rem;
}

.main-page-brand-section-items-single-icon-box-title {
  width: 80px;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  padding: 0px!important;
  margin: 0px!important;
}

.car-service-page-user-car-feature-item-single-box-title {
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  padding: 0px!important;
  margin: 0px!important;
  color: #fff;
}

.main-page-offcanvas-category-section-items-single-icon-box-title {
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  padding: 0px!important;
  margin: 0px!important;
}

.main-page-category-section-items-single-icon-box-title {
  width: 80px;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  padding: 0px!important;
  margin: 0px!important;
}

::-webkit-scrollbar {
}

.shop-home-header-container {
  background: #ffffff;
  padding: 1rem 1.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  z-index: 10;
  max-width: 480px!important;
  margin-top: -1rem;
}

.shop-home-header-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.5rem;
}

.search-shop-page-search-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  position: relative;
  background: #f8f8f8;
  border-radius: 3rem;
  border: none!important;
}

.pinned-card-pin-box {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  position: relative;
}

.shop-home-header-icon {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  position: relative;
}

.shop-home-header-icons {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.shop-middle-banner {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 0 1.5rem;
}

.shop-ad-carousel-banner-box {
  border-radius: 1rem;
}

.shop-ad-carousel-banner-img {
  width: 70vw;
  border-radius: 1rem;
  height: auto;
  max-width: 320px;
}

.shop-middle-banner-img {
  width: 100%;
  border-radius: 1rem;
}

.shop-home-suggest-container {
  background: linear-gradient(194deg, #A055FF 25.48%, #6D00F7 82.99%);
  padding: 0rem 0rem 6rem 0rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 1.75rem;
}

.suggest-product-car-service-container {
  padding: 0rem 0rem 1.875rem 0rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.shop-home-off-container {
  background: linear-gradient(194deg, #F55 25.48%, #F70000 82.99%);
  padding: 0rem 0rem 1.875rem 0rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.shop-home-off-section-title {
  font-size: 18px;
  margin: 1rem 0 0.5rem 0;
  padding: 0px 1.5rem;
  text-align: center;
  color: #fff;
}

.shop-home-blog-section-title {
  font-size: 18px;
  margin: 0px;
  padding: 0px 1.5rem;
  text-align: center;
  font-weight: 500;
}

.shop-home-brands-section-title {
  font-size: 18px;
  margin: 0px;
  padding: 0px 1.5rem;
  text-align: center;
  font-weight: 500;
}

.suggest-product-car-service-container-title {
  font-size: 15px;
  margin: 0px;
  padding: 0px 1.5rem;
  font-weight: 500;
}

.car-service-suggested-product-other-section-title {
  font-size: 14px;
  margin: 0px;
  padding: 0px 1.5rem;
  font-weight: 500;
  color: #212529;
}

.car-service-suggested-product-section-title {
  font-size: 14px;
  margin: 0px;
  padding: 0px 1.5rem;
  font-weight: 500;
  color: #fff;
}

.shop-home-section-title {
  font-size: 15px;
  margin: 0px;
  padding: 0px 1.5rem;
  font-weight: 500;
}

.shop-home-popular-tabs {
  width: 100%;
  margin-top: 1.25rem;
}

.shop-home-off-tab-bar.top-tabbar {
  --bs-nav-pills-border-radius: 0.375rem;
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: #09d498;
  overflow-x: overlay;
  overflow-y: hidden;
  width: 100%!important;
  flex-wrap: nowrap;
  padding: 0 1.5rem !important;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0px!important;
  gap: 0.25rem;
  border: none;
}

.shop-home-popular-tab-bar.top-tabbar {
  --bs-nav-pills-border-radius: 0.375rem;
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: #09d498;
  overflow-x: overlay;
  overflow-y: hidden;
  width: 100%!important;
  flex-wrap: nowrap;
  padding: 0 1.5rem !important;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  margin: 0px!important;
  gap: 0.25rem;
  border: none;
}

.shop-home-suggest-tab-bar-single {
  font-weight: 500;
  background: rgba(255, 255, 255, 0.15)!important;
  border-radius: 20px!important;
  color: #828282;
  border: none!important;
  font-size: 13px;
}

.shop-home-off-tab-bar-single {
  font-weight: 500;
  background: rgba(255, 255, 255, 0.15)!important;
  border-radius: 20px!important;
  color: #828282;
  border: none!important;
  font-size: 13px;
}

.shop-home-popular-tab-bar-single {
  font-weight: 500;
  background: #F8F8F8!important;
  border-radius: 20px!important;
  color: #828282;
  border: none!important;
  font-size: 13px;
}

.shop-home-off-tabs-container {
  overflow: hidden;
  border: none;
  margin-top: 1rem;
}

.shop-home-popular-tabs-container {
  overflow: hidden;
  border: none;
  margin-top: 1rem;
}

.shop-home-popular-tab-bar-single-link.active {
  min-width: 96px!important;
  padding: 0px!important;
  color: #828282!important;
  width: 100%;
  text-align: center;
}

.shop-home-popular-tab-bar-single-link {
  min-width: 96px!important;
  padding: 0.5rem 0.75rem!important;
  color: #828282!important;
  width: 100%;
  text-align: center;
}

.shop-home-suggest-tab-bar-single-link {
  min-width: 96px!important;
  padding: 0.5rem 0.75rem!important;
  color: #fff!important;
  width: 100%;
  text-align: center;
}

.shop-home-off-tab-bar-single-link {
  min-width: 96px!important;
  padding: 0.5rem 0.75rem!important;
  color: #fff!important;
  width: 100%;
  text-align: center;
}

.shop-home-popular-tab-bar-single-active {
  font-weight: 500;
  padding: !important;
  background: #07c990!important;
  border-radius: 20px!important;
  color: #ffffff;
  border: none!important;
}

.shop-home-popular-tab-bar-single-link-active {
  min-width: 72px!important;
  padding: 0px!important;
  color: #ffffff!important;
  width: 100%;
  text-align: center;
  background: none!important;
  border: none!important;
}

.shop-home-popular-tab-bar.top-tabbar::-webkit-scrollbar {
  display: none;
}

.shop-home-blog-content-container {
  padding: 0.25rem 1.5rem 0rem 1.5rem;
  display: flex;
  gap: 8px;
  overflow-x: overlay;
  max-width: 100vw;
}

.suggest-product-car-service-content-container {
  padding: 0.25rem 1.5rem 0rem 1.5rem;
  display: flex;
  gap: 8px;
  overflow-x: overlay;
  max-width: 100%;
}

.shop-home-new-content-container {
  padding: 0.25rem 1.5rem 0rem 1.5rem;
  display: flex;
  gap: 8px;
  overflow-x: overlay;
  max-width: 100vw;
}

.car-service-page-suggested-product-list-container {
  padding: 0 1.5rem;
  display: flex;
  gap: 8px;
  overflow-x: overlay;
  max-width: 480px;
}

.shop-home-off-tab-content-container-bottom {
  padding: 0.25rem 1.5rem 0rem 4.5rem;
  display: flex;
  gap: 8px;
  overflow-x: overlay;
  max-width: 100vw;
}

.shop-home-off-tab-content-container {
  padding: 1rem 4.5rem 0.25rem 1.5rem;
  display: flex;
  gap: 8px;
  overflow-x: overlay;
  max-width: 100vw;
}

.shop-home-popular-tab-content-container {
  padding: 1rem 1.5rem;
  display: grid!important;
  grid-template-columns: 50% 50%;
  gap: 10px;
  max-width: 480px;
}

.product-page-waranty-container-content-box-title {
  padding: 0px;
  margin: 0px;
  font-size: 12px;
  line-height: 20px;
  color: #212529;
}

.product-page-car-suggestion-title {
  padding: 0px;
  margin: 0px;
  font-size: 14px;
  line-height: 20px;
  color: #212529;
  font-weight: 500;
  margin-right: 1.5rem;
}

.product-page-user-suggestion-user-title {
  padding: 0px;
  margin: 0px;
  font-size: 14px;
  line-height: 20px;
  color: #212529;
  font-weight: 500;
}

.product-page-user-comment-rating-section-value {
  padding: 0px;
  margin: 0px;
  font-size: 20px;
  color: #212529;
  font-weight: 500;
}

.product-page-product-rate-container-rating-value {
  padding: 0px;
  margin: 0px;
  font-size: 12px;
  color: #6c6c6c;
}

.product-page-product-rate-container-user-comment {
  padding: 0px;
  margin: 0px;
  font-size: 13px;
  font-weight: 500;
}

.shop-home-popular-product-content-des-rate-value {
  width: 100%;
  padding: 0px;
  margin: 0px;
  font-size: 15px;
}

.shop-home-suggest-carousel-product-content-des-price-off-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
  font-weight: 500;
  color: #eb3540;
}

.shop-home-suggest-carousel-product-content-des-price-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
  font-weight: 500;
}

.suggest-product-car-service-product-content-des-price-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
}

.shop-home-new-product-content-des-price-off-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
  color: #eb3540;
}

.shop-home-new-product-content-des-price-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
}

.car-service-page-suggested-product-content-des-price-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
  color: #212529;
}

.shop-home-off-product-content-des-price-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
  color: #EB3540;
}

.shop-home-popular-product-content-des-off-price-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
  color: #eb3540;
}

.shop-home-popular-product-content-des-price-value {
  padding: 0px;
  margin: 0px;
  font-size: 15px;
}

.shop-home-suggest-carousel-product-content-title {
  margin: 0px;
  padding: 0px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
  text-align: center;
  width: 90%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.shop-home-post-blog-content-title {
  margin: 0px;
  padding: 0px;
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
}

.suggest-product-car-service-product-content-title {
  margin: 0px;
  padding: 0px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
}

.car-service-features-list-single-title {
  margin: 0px;
  padding: 0px;
  font-size: 12px;
  line-height: 18px;
  font-weight: 500;
  text-align: center;
}

.shop-home-new-product-content-title {
  margin: 0px;
  padding: 0px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
  text-align: right;
}

.shop-home-off-product-content-title-all {
  margin: 0px;
  padding: 0px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
  color: #fff!important;
  width: 60px;
  text-align: center;
}

.shop-home-off-product-content-title {
  margin: 0px;
  padding: 0px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
}

.shop-home-popular-product-content-title {
  margin: 0px;
  padding: 0px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
}

.shop-home-off-product-img {
  width: 86px;
}

.shop-home-suggest-carousel-product-img {
  width: 200px;
}

.shop-home-blog-post-img {
  width: 300px;
  border-radius: 1rem 1rem 0 0;
  z-index: 0;
  height: 160px;
}

.suggest-product-car-service-product-img {
  width: 150px;
}

.shop-home-new-product-img {
  width: 140px;
}

.shop-home-popular-product-img {
  width: 132px;
}

.shop-home-suggest-carousel-product-content-des-price {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.shop-home-new-product-content-des-price {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.shop-home-off-product-content-des-price {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.shop-home-popular-product-content-des-price {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.shop-home-popular-product-content-des {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.product-page-notic-container-content-box {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.product-page-waranty-container-content-box {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.product-page-product-rate-container-rating {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.product-page-product-rate-container-rating {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.shop-home-popular-product-content-des-rate {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.shop-home-suggest-carousel-slide-product {
  padding: 1.5rem;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  background: #fff;
  max-width: 432px;
}

.shop-home-blog-post {
  padding: 0;
  border: 1px solid #eeeeee;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 300px;
  background: #fff;
  position: relative;
}

.shop-home-blog-show-more-container {
  padding: 1rem;
  border: none;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  width: 20rem;
  background: #f8f8f8;
}

.shop-home-new-product {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: calc((100vw - 6vw) /2);
  background: #fff;
  position: relative;
}

.suggest-product-car-service-product {
  padding: 1rem;
  border: 1px solid #eeeeee;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 12rem;
  background: #fff;
}

.shop-home-off-product {
  padding: 1rem;
  border: none;
  border-radius: 1rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  width: 18rem;
  background: #fff;
  position: relative;
}

.shop-home-popular-product {
  padding: 1rem;
  border: 1px solid #eee;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  position: relative;
}

.shop-home-popular-product-content-des-price-icon {
  width: 20px;
}

.shop-home-suggest-carousel-product-content-des-price-icon {
  width: 20px;
}

.shop-home-new-product-content-des-price-icon {
  width: 20px;
}

.product-page-waranty-container-content-box-icon {
  width: 20px;
}

.product-page-notic-container-content-box-icon {
  width: 20px;
}

.product-page-user-comment-rate-value-section-rate-icon {
  width: 28px;
}

.shop-home-popular-product-content-des-rate-icon {
  width: 18px;
}

.shop-home-off-product-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  width: 200px;
}

.shop-home-suggest-carousel-product-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
}

.suggest-product-car-service-product-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
}

.shop-home-new-product-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  width: 160px;
}

.shop-home-blog-heading-section {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0 0 0.5rem 1.5rem;
}

.suggest-product-car-service-container-heading-section {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0 0 0.5rem 1.5rem;
  width: 100%;
}

.shop-home-blog-post-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  width: calc(100% - 2rem);
  padding-bottom: 1rem;
}

.shop-home-popular-product-content {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.shop-home-popular-tab-bar-single-link:hover .shop-home-popular-tab-bar-single-link:focus {
  min-width: 72px!important;
  padding: 0px!important;
  color: #828282!important;
  width: 100%;
  text-align: center;
}

.active-popular-tab-item, .active-popular-tab-item:hover, .active-popular-tab-item:focus {
  background: none!important;
  color: #fff!important;
  border: 0px!important;
}

.deactive-popular-tab-item, .deactive-popular-tab-item:hover, .deactive-popular-tab-item:focus {
  background: none!important;
  color: #828282!important;
  border: 0px!important;
}

.nav-link.active {
  background: #07c990!important;
  padding: 0.5rem 0.75rem!important;
  color: #ffffff!important;
  text-align: center;
  border-radius: 20px;
  border: none;
  height: 100%!important;
  position: relative!important;
}

.nav-tabs .nav-link {
  margin-bottom: calc(-1 * var(--bs-nav-tabs-border-width));
  background: 0 0;
  border: none;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  margin-bottom: 0px;
}

.shop-home-brand-item-single-img-box-img {
  width: 54px;
}

.car-service-page-user-car-item-single-img-box-img {
  width: 32px;
}

.shop-home-category-item-single-img-box-img {
  width: 40px;
}

.shop-home-category-divider {
  height: 40px;
  width: 1px;
  background: #eeeeee;
}

.shop-home-off-container-overlay {
  width: 100%;
}

.shop-home-off-icon {
  width: 120px;
  z-index: 1;
  margin-top: -5rem;
}

.car-service-page-suggested-products-other-container {
  padding: 1.5rem 0 2rem 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: #fff;
}

.car-service-page-suggested-products-container {
  padding: 1.5rem 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: linear-gradient(194deg, #A055FF 25.48%, #6D00F7 82.99%);
  margin-bottom: 2rem;
}

.product-page-simelar-products-container {
  padding: 1.75rem 0 8rem 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.shop-home-new-container {
  padding: 1.75rem 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.shop-home-brands-container {
  padding: 3rem 1.5rem 2rem 1.5rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.shop-home-blog-container {
  padding: 2rem 0 6rem 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.shop-home-ad-cards-container {
  padding: 0 1.5rem;
  display: flex;
  flex-direction: row;
  overflow: overlay;
  gap: 0.5rem;
}

.shop-home-popular-container {
  padding: 1.75rem 0rem 1.25rem 0rem;
  overflow: hidden;
}

.shop-home-off-tab-content-container::-webkit-scrollbar {
  display: none;
}

.shop-home-off-tab-content-container-bottom::-webkit-scrollbar {
  display: none;
}

.shop-home-blog-post-content-des {
  font-size: 13px;
  margin: 0px;
  padding: 0;
  color: #6c6c6c;
  width: 100%;
  text-align: right;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.shop-home-blog-container-des {
  font-size: 13px;
  margin: 0px;
  padding: 0px 1.5rem;
  text-align: center;
  color: #6c6c6c;
}

.shop-home-brands-container-des {
  font-size: 13px;
  margin: 0px;
  padding: 0px 1.5rem;
  text-align: center;
  color: #6c6c6c;
}

.shop-home-ad-cards-container::-webkit-scrollbar {
  display: none;
}

.shop-home-new-content-container::-webkit-scrollbar {
  display: none;
}

.shop-home-suggest-carousel {
  width: calc(100vw - 3rem);
  margin: 0 auto;
  border-radius: 1rem;
  overflow: hidden;
  height: 376px;
  padding: 1rem 0;
  max-width: 432px;
}

.shop-home-suggest-carousel-indicators {
  bottom: 0px;
  z-index: 1000;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.shop-home-suggest-carousel-slide {
  height: 376px;
}

.shop-home-blog-content-container::-webkit-scrollbar {
  display: none;
}

.cart-quantity-controller-left {
  border: 1px solid #efefef;
  background: #fff;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0.1rem;
  color: #6c6c6c;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-top-right-radius: 0!important;
  border-bottom-right-radius: 0!important;
  border-top-left-radius: 0.5rem!important;
  border-bottom-left-radius: 0.5rem!important;
  border-right: none;
}

.cart-quantity-controller-right {
  border: 1px solid #efefef;
  background: #fff;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0.1rem;
  color: #6c6c6c;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-top-right-radius: 0.5rem!important;
  border-bottom-right-radius: 0.5rem!important;
  border-top-left-radius: 0px!important;
  border-bottom-left-radius: 0px!important;
  border-left: none;
}

.cart-quantity-value {
  border-top: 1px solid #efefef;
  border-bottom: 1px solid #efefef;
  border-right: none;
  border-left: none;
  text-align: center;
  font-size: 14px;
  line-height: 14px;
  height: 1.75rem;
  width: 2rem!important;
  padding: 0.1rem!important;
}

.cart-quantity-value:focus, .cart-quantity-value:visited {
  box-shadow: none!important;
  border-top: 1px solid #efefef!important;
  border-bottom: 1px solid #efefef!important;
  border-right: none!important;
  border-left: none!important;
}

.cart-page-main-content {
  width: 100%;
}

.car-service-car-card-car-img {
  width: 240px;
  margin: 0 auto;
}

.suggest-product-car-service-content-container::-webkit-scrollbar {
  display: none;
}

.car-service-features-list-single-img {
  width: 32px;
}

.order-tracking-container {
  height: 36px;
  background: linear-gradient(284deg, #6952F6 52.37%, #B6AAFF 110.5%);
  padding: 0.5rem 1.5rem;
  color: #fff;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.order-tracking-container-text {
  font-size: 13px;
  line-height: 14px;
  padding: 0px;
  margin: 0px;
}

.order-tracking-container-text {
  color: #fff;
}

.payment-type-item-radio {
  border-radius: 12px!important;
  margin: 0px!important;
  border-width: 1px!important;
  width: calc(85% / 3);
  max-width: 480px;
  padding: 4rem 1.5rem 3rem 1.5rem!important;
}

.filter-type-item-radio {
  border-radius: 12px!important;
  margin: 0px!important;
  border-width: 1px!important;
  width: 100px!important;
  padding: 0rem 1.5rem 0rem 1.5rem!important;
  height: 56px!important;
}

.delivery-address-type-item-radio {
  border-radius: 12px!important;
  margin: 0px!important;
  border-width: 1px!important;
  width: calc((100vw - 3rem) / 2);
  max-width: calc((468px - 3rem) / 2);
}

.delivery-type-item-radio {
  height: 76px!important;
  border-radius: 12px!important;
  margin: 0px!important;
  border-width: 1px!important;
  width: calc(100vw - 3rem);
  max-width: 432px;
}

.radio-icon {
  z-index: 10;
  width: 20px;
  height: 20px;
}

.filter-type-item-content-icon-box-img {
  width: 3rem;
  height: 3rem;
}

.payment-type-item-content-icon-box-img {
  width: 2.5rem;
  height: 2.5rem;
}

.delivery-type-item-content-icon-box-img {
  width: 3rem;
  height: 3rem;
}

.order-tracking-container:hover, .order-tracking-container:visited, .order-tracking-container:focus {
  color: #fff!important;
}

.embed-link-post {
  position: relative;
  height: 100%!important;
}

.iframe-container {
  height: calc(100vh - 80px);
  padding-top: 4rem;
}

--webkit-scrollbar {
}

.filter-details-product-list-box::-webkit-scrollbar {
  display: none;
}

.filter-submit-button {
  width: calc(100% - 3rem);
}

.bread-crumb-container {
  padding: 0.5rem 1.5rem;
}

.product-page-product-title-container-title {
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: #212529;
  padding: 0px;
  margin: 0px;
}

.product-page-product-rate-container-comment-link {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}

.product-page-product-title-container {
  padding: 1rem 1.5rem;
}

.off-canvas-rating-text-box {
  margin-top: 1rem;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.rating-point {
  width: 74%;
  position: relative;
  margin: 0 auto;
  margin-bottom: 1rem;
}

.comment-rating {
  width: 64px;
}

.product-page-user-comment-text-box {
  width: 100%;
  padding: 0.5rem 0 1rem 0;
}

.station-page-user-comment-single-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.product-page-user-comment-single-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.replay-comment-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.25rem;
  font-size: 17px;
  color: #6c6c6c;
}

.answer-comment-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.25rem;
  font-size: 17px;
  color: #6c6c6c;
  margin-bottom: 1rem;
  margin-top: 0.5rem;
}

.delete-comment-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.25rem;
  font-size: 17px;
  color: #f74f77;
}

.product-page-product-rate-container-comment-new-comment-link {
  color: #00c289;
}

.product-page-product-rate-container-comment-new-comment-link:visited, .product-page-product-rate-container-comment-new-comment-link:focus, .product-page-product-rate-container-comment-new-comment-link:hover {
  color: #00c289!important;
}

.product-page-features-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.product-page-about-h3 {
  font-size: 14px;
  font-weight: 500;
  margin-top: 1rem;
}

.product-page-about-h2 {
  font-size: 14px;
  font-weight: 500;
  margin-top: 1rem;
}

.replay-comment-box:visited, .replay-comment-box:focus, .replay-comment-box:hover {
  color: #6c6c6c!important;
}

.delete-comment-box:focus, .delete-comment-box:visited, .delete-comment-box:hover {
  color: #f74f77!important;
}

.product-page-add-cart-fload-off-box-line {
  width: 100%;
  position: absolute;
  border-width: 2px;
  z-index: 1;
  color: #9e9e9e;
  opacity: 1!important;
}

.line-hidden-suggestions {
  width: 89%;
  height: 4px;
  background: #ffffff;
  position: absolute;
  z-index: 1;
  margin: 0 auto;
  bottom: 14px;
}

.category-page-line-hidden {
  width: 100%;
  height: 4px;
  background: #ffffff;
  position: absolute;
  z-index: 1;
  margin: 0 auto;
  bottom: 32px;
}

.line-hidden {
  width: 89%;
  height: 4px;
  background: #ffffff;
  position: absolute;
  z-index: 1;
  margin: 0 auto;
  bottom: 14px;
}

.product-page-notic-container-content-box-text {
  padding: 0px;
  margin: 0px;
  font-size: 12px;
  line-height: 20px;
  color: #824e00;
}

.home-page-product-carousel-divider {
  border-right: 1px solid #eeeeee;
}

.shop-home-product-image-container-offer-list-box {
  background: red;
  position: absolute;
  padding: 0.15rem 0.5rem 0.05rem 0.5rem;
  border-radius: 24px;
  bottom: 24px;
  left: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
}

.category-list-page-offer-box {
  background: red;
  position: absolute;
  padding: 0.15rem 0.5rem 0.05rem 0.5rem;
  border-radius: 24px;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
}

.shop-home-product-carousel-container-offer-box {
  background: red;
  position: absolute;
  padding: 0.15rem 0.5rem 0.05rem 0.5rem;
  border-radius: 24px;
  top: 16px;
  left: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
}

.shop-home-product-image-container-offer-box {
  background: red;
  position: absolute;
  padding: 0.15rem 0.5rem 0.05rem 0.5rem;
  border-radius: 24px;
  top: 8px;
  left: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
}

.product-page-product-image-container-offer-box {
  background: red;
  position: absolute;
  padding: 0.15rem 0.5rem 0.05rem 0.5rem;
  border-radius: 24px;
  top: 5rem;
  left: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
}

.shop-home-product-image-container-offer-box-preset {
  color: #ffffff;
  font-size: 13px;
  font-weight: 400;
  margin: 0px!important;
  padding: 0px!important;
}

.product-page-product-image-container-offer-box-preset {
  color: #ffffff;
  font-size: 15px;
  font-weight: 400;
  margin: 0px!important;
  padding: 0px!important;
}

.shop-home-product-image-container-offer-box-value {
  color: #ffffff;
  font-size: 13px;
  font-weight: 400;
  margin: 0px!important;
  padding: 0px!important;
}

.product-page-product-image-container-offer-box-value {
  color: #ffffff;
  font-size: 15px;
  font-weight: 400;
  margin: 0px!important;
  padding: 0px!important;
}

.product-page-car-suggestion-car-item-container {
  gap: 0.5rem;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  overflow-x: overlay;
  position: relative;
  width: 100%;
  height: auto;
  padding-right: 1.5rem;
  padding-left: 1.5rem;
}

.pinned-card-user-avatar-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding-right: 10px;
  margin-top: 0.5rem;
}

.product-page-user-suggestion-user-avatar-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding-right: 14px;
}

.pinned-card-user-avatar-container-more {
  border-radius: 30px;
  width: 36px;
  height: 36px;
  margin-right: -10px;
  border: 3px solid #fff;
  background: #e3e3e3;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.pinned-card-user-avatar-container-img {
  border-radius: 30px;
  width: 36px;
  height: 36px;
  margin-right: -10px;
  border: 3px solid #fff;
}

.product-page-user-suggestion-user-avatar-container-img {
  border-radius: 30px;
  width: 48px;
  height: 48px;
  margin-right: -16px;
  border: 3px solid #fff;
}

.product-page-user-suggestion-user {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.75rem;
  width: 100%;
}

.product-page-car-suggestion-container-single-car {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 0.75rem;
  border-radius: 0.75rem;
  background: #fff;
  border: 1px solid #efefef;
  gap: 0.5rem;
}

.product-page-car-suggestion-container-single-car-img {
  width: 56px;
  height: auto;
}

.product-page-car-suggestion-container-single {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  padding: 0.75rem 0.5rem;
  border: 1px solid #efefef;
  border-radius: 0.75rem;
}

.product-page-car-suggestion-car-item-container::-webkit-scrollbar {
  display: none;
}

.order-history-page {
  padding-top: 4rem;
}

.product-page-user-comment-rate-value-section-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.category-list-top-carousel-container {
  padding-top: 4rem;
}

.car-service-page-suggested-product-list-container::-webkit-scrollbar {
  display: none;
}

.car {
}

.car-service-add-car-empty-state-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  background: #09d498;
  border-radius: 12px;
  padding: 0.8rem 0.5rem;
  width: 160px;
  margin-top: 1rem;
  gap: 0.5rem;
}

.car-service-add-car-empty-state-container-text-icon {
  font-size: 18px;
  color: #fff;
}

.car-service-add-car-empty-state-container-icon {
  font-size: 20px;
  color: #fff;
}

.car-service-add-car-empty-state-container:hove, .car-service-add-car-empty-state-container:focus, .car-service-add-car-empty-state-container:visited {
  background: #06ba84;
}

.station-page-user-comment-user-name-box-name-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.25rem;
}

.user-page-user-comment-user-box-name-tick {
  width: 1.2rem;
}

.tab-link.bottom-tab-item-link {
  border: none!important;
  width: 100%!important;
  height: 100%!important;
  position: relative;
}

.shop-home-off-tab-bar-single-link.active {
  color: #FE4848!important;
  background: #fff!important;
}

.shop-home-suggest-tab-bar-single.active {
  color: #A055FF!important;
}

.shop-home-suggest-tab-bar-single-link.active {
  color: #A055FF!important;
  background: #fff!important;
}

.top-tab-link.active {
  position: relative!important;
  height: 52px!important;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid #09d498!important;
}

.pinned-card-icon {
  font-size: 18px;
}

.car-pelak-form {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  overflow: hidden;
  border: 2px solid#000;
  border-radius: 8px;
  height: 72px;
}

.pelak-container-left-img {
  width: 28px;
}

.pelak-form-input-city {
  border-left: 2px solid #212529;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 0 0 0;
  width: calc(100% - (70% + 28px));
}

.pelak-form-input-city-img {
  width: 60px;
}

.pelak-form-input-style:focus, .pelak-form-input-style:visited {
  border: none!important;
  box-shadow: none!important;
}

.pelak-form-left-input-style:focus, .pelak-form-left-input-style:visited {
  border: none!important;
  box-shadow: none!important;
}

.pelak-form-city-code-input-style:focus, .pelak-form-city-code-input-style:visited {
  border: none!important;
  box-shadow: none!important;
}

.search-page-search-form {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: start;
  gap: 0.5rem;
}

.search-shop-page-search-button:hover, .search-shop-page-search-button:active, .search-shop-page-search-button:checked, .search-shop-page-search-button:focus, .search-shop-page-search-button:click {
  background: #f8f8f8!important;
  border: none!important;
}

.search-shop-page-search-button:hover, .search-shop-page-search-button:focus {
  background: #f8f8f8!important;
  border: none!important;
}

.shop-home-off-product-all-product {
  padding: 1rem;
  border: none;
  border-radius: 1rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  background: rgba(255,255,255,0.18);
  position: relative;
  width: 8rem;
  color: #fff;
}

.product-page-car-suggestion-container-single-all {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  border-radius: 0.75rem;
  height: 64px;
  background: #f9f9f9;
}

.blog-post-main-container {
padding: 0.5rem 1.5rem;
}

.disabled-product {
  filter: grayscale(100%)!important;
}

.pinned-card-home-container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  position: relative;
  width: 300px;
  padding: 1rem;
  border-radius: 1.25rem;
  background: rgb(247,247,247);
}

.pinned-card-home-head {
  font-size: 14px;
  font-weight: 500;
  margin: 0px;
  padding: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  width: calc(300px - 6rem);
}

.pinned-station-image {
  width: 56px;
  height: 56px;
  border-radius: 100px;
  border: 1px solid #f1f1f1;
  padding: 0;
  background: #fff;
}

.pinned-stations-box {
  padding: 1rem 0;
}

.pinned-card-home-list-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  overflow-x: overlay;
  position: relative;
  gap: 0.5rem;
  padding: 0 1.5rem;
}

.pinned-card-home-list-container::-webkit-scrollbar {
  display: none;
}