.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none; /* IE e Edge */
  scrollbar-width: none; /* Firefox */
}

.app-loading-spinner {
  animation: app-loading-spin 0.8s linear infinite;
}
.app-loading.is-hidden {
  opacity: 0;
  pointer-events: none;
}
@keyframes app-loading-spin {
  to {
    transform: rotate(360deg);
  }
}

.btn-spinner {
  animation: app-loading-spin 0.8s linear infinite;
}

.search-spinner {
  animation: app-loading-spin 0.8s linear infinite;
}
.search-spinner.is-loading {
  opacity: 1;
}
[data-search-icon].is-loading [data-search-lupa] {
  opacity: 0;
  pointer-events: none;
}
.btn-loading {
  pointer-events: none;
  opacity: 0.85;
}

.cart-drawer-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}
.cart-drawer-panel.is-open {
  transform: translateX(0);
}

.filter-menu.is-open {
  display: block;
}

.menu-items-dropdown.is-open {
  display: block;
}

[data-menu-items-toggle]:hover {
  border-color: var(--merchant-primary-btn-bg) !important;
  background-color: color-mix(in srgb, var(--merchant-primary-btn-bg) 10%, transparent) !important;
}
[data-menu-items-toggle]:focus {
  --tw-ring-color: var(--merchant-primary-btn-bg);
}

:root {
  --merchant-primary-btn-bg: #fe509c;
  --merchant-primary-btn-text: #ffffff;
  --merchant-secondary-btn-bg: #666666;
  --merchant-secondary-btn-text: #ffffff;
  --merchant-header-bg: #ffffff;
  --merchant-header-elements: #666666;
  --merchant-footer-bg: #f5f5f5;
  --merchant-footer-text: #666666;
  --merchant-total-value: #44c485;
}

.category-pill-active {
  background-color: var(--merchant-primary-btn-bg) !important;
  color: var(--merchant-primary-btn-text) !important;
  border-color: var(--merchant-primary-btn-bg) !important;
}
.category-pill-inactive:hover {
  border-color: var(--merchant-primary-btn-bg) !important;
  color: var(--merchant-primary-btn-bg) !important;
}

[data-filter-toggle]:hover {
  border-color: var(--merchant-primary-btn-bg) !important;
  background-color: color-mix(in srgb, var(--merchant-primary-btn-bg) 10%, transparent) !important;
}
[data-filter-toggle]:focus {
  --tw-ring-color: var(--merchant-primary-btn-bg);
}

.auth-modal-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}
.auth-modal.is-open {
  opacity: 1;
  pointer-events: auto;
  scale: 1;
}
.auth-tab.active {
  background-color: var(--merchant-primary-btn-bg);
  color: var(--merchant-primary-btn-text);
}
.auth-tab:not(.active) {
  color: var(--merchant-header-elements, #666666);
}
.auth-tab:not(.active):hover {
  color: var(--merchant-primary-btn-bg);
}

.product-overlay-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}
.product-overlay {
  top: auto;
  bottom: 0;
  border-radius: 1rem 1rem 0 0;
}
.product-overlay.is-open {
  transform: translateY(0);
  opacity: 1;
}
.product-overlay:not(.is-open) {
  transform: translateY(100%);
}