.ocellaris-filters-toggle{display:none;border:0;background:#007cba;color:#fff;padding:8px 12px;border-radius:6px;font-weight:600;cursor:pointer;align-items:center;gap:8px}
.oc-filters-icon{font-size:16px}
.oc-filters-text{display:inline-block}
.oc-filters-icon svg{display:block;fill:currentColor}

/* Drawer - hidden by default */
.ocellaris-filters-drawer{position:fixed;top:0;right:0;bottom:0;width:360px;max-width:92%;transform:translateX(100%);transition:transform .28s ease;z-index:99999;background:#fff;box-shadow:-12px 0 30px rgba(0,0,0,.25);display:flex;flex-direction:column}
.ocellaris-filters-drawer-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #eee}
.ocellaris-filters-drawer-header h3{margin:0;font-size:16px}
.ocellaris-filters-close{border:0;background:transparent;font-size:22px;line-height:1;cursor:pointer}
.ocellaris-filters-drawer-content{overflow:auto;padding:14px 16px;outline:none}
.ocellaris-filters-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:99998}

/* When open */
html.ocellaris-filters-open .ocellaris-filters-drawer{transform:translateX(0)}
html.ocellaris-filters-open .ocellaris-filters-backdrop{display:block}

/* Mobile only: show toggle button and use compact styles */
@media (max-width: 768px) {
  .ocellaris-filters-toggle{display:inline-flex}
  .ocellaris-filters-drawer{width:86%;max-width:420px}
}

@media (max-width: 420px) {
  .ocellaris-filters-drawer{width:100%}
}