/* Show the button only on mobile */
.as-filter-btn {
  display: none;
  margin: 0 0 1rem;
  padding: .6rem .9rem;
  border: 1px solid var(--ast-border-color, #e2e2e2);
  background: #fff;
  border-radius: .5rem;
  font-weight: 600;
   color: var(--m1);
}
@media (max-width: 991px) {
  .as-filter-btn { display: inline-flex; align-items: center; gap: .5rem;   color: var(--m1);   }
}

/* Off-canvas layout */
.as-offcanvas {
  position: fixed;
  top: 0; right: 0;
  width: 90vw; max-width: 420px; height: 100dvh;
  background: #fff;
  transform: translateX(100%);
  transition: transform .25s ease;
  z-index: 99999;
  display: flex; flex-direction: column;
  box-shadow: -8px 0 24px rgba(0,0,0,.1);
}
.as-offcanvas.is-open { transform: translateX(0); }

.as-offcanvas__header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1rem; border-bottom: 1px solid #eee;
}
.as-offcanvas__body {
  overflow: auto; -webkit-overflow-scrolling: touch;
  padding: 1rem; flex: 1;
}

.as-offcanvas__close {
    background: transparent;
    border: 0px solid #ddd;
    padding: .4rem .6rem;
    border-radius: .4rem;
    cursor: pointer;
    color: var(--m1);
}

/* Backdrop */
.as-offcanvas__backdrop {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 99998;
}
.as-offcanvas__backdrop[hidden] { display: none; }

/* Prevent scroll on body when open */
.as-no-scroll { overflow: hidden; }

/* Optional: hide the normal sidebar on mobile, since we move it into the panel */
@media (max-width: 991px) {
  #secondary, .sidebar-main, .ast-woo-sidebar { display: none; }
  
.as-offcanvas__body .sidebar-main , .as-offcanvas__body #secondary , .as-offcanvas__body .ast-woo-sidebar {
	display:block!important;
}
  
}