.ml-ocf__toggle{
  display:inline-flex; align-items:center; gap: 0.2rem !important;;
  padding:.6rem 1rem; border:0; cursor:pointer;
  background:#1f2a44; color:#fff; border-radius:4px;
  padding: 0px !important;
}
.ml-ocf__toggle:hover{opacity:.92}
.ml-ocf__toggle-icon{width:14px; height:14px; margin-left:.25rem; margin-bottom: 3px;}


.ml-ocf__overlay{ position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9998; }
.ml-ocf__panel{
  position:fixed; top:0; left:0; height:100vh; width:min(92vw, 360px);
  background:#fff; z-index:9999; transform:translateX(-100%);
  transition:transform .28s ease; display:flex; flex-direction:column;
  box-shadow:2px 0 18px rgba(0,0,0,.25);
}
body.ml-ocf-open .ml-ocf__panel{ transform:none; }

.ml-ocf__header{ display:flex; align-items:center; justify-content:space-between; border-bottom: 1px solid #0000008c; color:#fff }
.ml-ocf__header h2{ margin:0; font-size:1rem; letter-spacing:.08em }
.ml-ocf__close{ background:none; border:0; color:#fff; font-size:1.5rem; line-height:1; cursor:pointer }

.ml-ocf__content{ padding:1rem 1.25rem; overflow-y:auto; max-height: 85vh; -webkit-overflow-scrolling: touch; }
.ml-ocf__hint{ opacity:.7; font-size:.95rem }


.ml-ocf__panel .widget{ margin-bottom:1rem }
.ml-ocf__panel .widget-title{ margin:.25rem 0 .5rem; font-size:.95rem }


.ml-ocf__active{ background: #77826a70; border:1px solid #eee; padding:1rem; border-radius:6px; margin-bottom:1rem }
.ml-ocf__active .widget-title{ margin:0 0 .5rem }
.woocommerce-widget-layered-nav-filters ul{ list-style:none; padding:0; margin:0 }
.woocommerce-widget-layered-nav-filters li{ display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #eae6df; padding:.35rem 0 }
.woocommerce-widget-layered-nav-filters a{ text-decoration:none }
.woocommerce-widget-layered-nav-filters .chosen a{ display:inline-flex; align-items:center; gap:.35rem }
.woocommerce-widget-layered-nav-filters .chosen a:after{
  content:'×'; display:flex; justify-content: center; align-items: center; padding: 6px; width:18px; height:18px; line-height:18px; text-align:center; border-radius:50%;
  border:1px solid currentColor; font-weight:700; font-size:.9rem; opacity:.8
}
.ml-ocf__active-actions{ display:flex; justify-content:flex-end; margin-top:.5rem }
.ml-ocf__clear.button{ border-radius: 30px; background:#f2efe9; border:1px solid #cfc8bb; color:#111; padding: .0rem .8rem .9rem .8rem; text-transform:uppercase; font-size:.78rem }
.ml-ocf__clear.button:hover{ background:#eae6df }

.ml-ocf{
  display:inline-flex;        
  align-items:center;
}


.ml-ocf__toggle{
  display:inline-flex;
  align-items:center;
  gap:.5rem;                  
  padding:0;                  
  background:transparent;    
  color:inherit;             
  border:0;
  line-height:1;
}


.ml-ocf__toggle-icon{
  display:inline-flex;
  line-height:0;
  width: 16px!important;
	height: 16px!important;
	margin-bottom: 5px;
}
.ml-ocf__toggle-icon svg{
  display:inline-block;       
  width:18px;
  height:18px;
  vertical-align:middle;
  stroke:currentColor;
}


.ml-ocf__toggle-text{
  display:inline-block;       
  position:relative;
  font-size: 16px;
}


.ml-ocf::before,
.ml-ocf::after,
.ml-ocf__toggle::before,
.ml-ocf__toggle::after,
.ml-ocf__toggle-text::before,
.ml-ocf__toggle-text::after{
  content:none !important;
  background:none !important;
}


.ml-ocf, .ml-ocf__toggle, .ml-ocf__toggle-text{
  background-image:none !important;
  font-family:inherit !important;
}

.ml-ocf__panel input[type="checkbox"],
.ml-ocf__panel input[type="radio"]{
  background-image: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  accent-color: #111; 
}


.ml-ocf__panel input[type="checkbox"]::before,
.ml-ocf__panel input[type="checkbox"]::after,
.ml-ocf__panel label::before,
.ml-ocf__panel label::after{
  content: none !important;
  background: none !important;
}

.wc-block-attribute-filter input:checked:before{
  background: none!important;
  background: unset!important;
  margin-bottom: 1.5px;
}

input:checked + .wc-block-components-checkbox__mark{
  margin-bottom: 2.5px;
}

#ml-ocf-title p{
  margin-bottom: unset!important;
  margin-top: unset!important;
}

.ml-ocf__panel{
	z-index: 99999999999!important;
  height: 100vh !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;             
  scrollbar-color: #b8b2aa transparent;
}

.ml-ocf__active-list .woocommerce-widget-layered-nav-filters .chosen a:after{
	padding-top: 5px!important;
    padding-left: 0.5px!important;
	padding-bottom: 0px!important;
	padding-right: 0px!important;
}

/* === Accordion for WC Blocks filters (.wc-blocks-filter-wrapper) — jQuery slide === */
#ml-ocf-panel .wc-blocks-filter-wrapper { position: static; }
#ml-ocf-panel .wc-blocks-filter-wrapper .wp-block-heading{
  cursor: pointer; user-select: none;
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 0;
}
#ml-ocf-panel .wc-blocks-filter-wrapper .wp-block-heading::after{
  content:''; width:8px; height:8px; border:2px solid currentColor; border-left:0; border-top:0;
  transform: rotate(-45deg); transition: transform .2s ease;
}
#ml-ocf-panel .wc-blocks-filter-wrapper .wp-block-heading[aria-expanded="true"]::after{ transform: rotate(45deg); }

/* body — hidden when collapsed; no fixed heights */
#ml-ocf-panel .wc-blocks-filter-wrapper .wp-block-woocommerce-attribute-filter.ml-acc-body{
  display:none;
}
#ml-ocf-panel, #ml-ocf-panel *{ overflow: visible; }


/* === Fix: force normal flow so sections push the next down === */
#ml-ocf-panel .wc-blocks-filter-wrapper { position: static !important; height: auto !important; min-height: 0 !important; overflow: visible !important; }
#ml-ocf-panel .wc-blocks-filter-wrapper > * { position: static !important; }
#ml-ocf-panel .wc-blocks-filter-wrapper .wp-block-woocommerce-attribute-filter { 
  position: static !important; 
  float: none !important; 
  clear: both !important; 
  margin-top: 8px; 
}
/* In collapsed state the body is hidden via jQuery (display:none), no max-height tricks */
.wp-block-woocommerce-filter-wrapper h3{
  background-image: unset!important;
}

@media (min-width: 782px) {
 .wc-blocks-filter-wrapper .wp-block-woocommerce-attribute-filter{
  margin-left: 0px!important;
 }
}