/* Native OCFilter mobile presentation. Desktop rules and native data are untouched. */
.bruno-mobile-filter-trigger, .bruno-mobile-filter-chips { display:none; }
@media (max-width:1270px) {
  body.bruno-mobile-filter-ready .open_filter_btn,
  body.bruno-mobile-filter-ready .bruno-mobile-filter-trigger {
    display:inline-flex !important; align-items:center; justify-content:center;
    gap:10px; min-width:120px; min-height:44px; height:auto; width:auto;
    padding:10px 18px; margin:12px 0 4px; box-sizing:border-box;
    border:1px solid #b89b68; border-radius:8px; background:#fff9ef;
    color:#58432b; font:600 15px/22px "DM Sans",Arial,sans-serif; cursor:pointer;
  }
  .bruno-mobile-filter-chips { display:flex; flex-wrap:wrap; gap:8px; margin:8px 0; }
  .bruno-mobile-filter-chips button { min-height:44px; padding:8px 12px; border:1px solid #cbb58e; border-radius:8px; background:#fff9ef; color:#58432b; font:14px/20px Arial,sans-serif; }
  dialog.bruno-mobile-filter { padding:0; margin:auto; box-sizing:border-box; width:min(440px,calc(100vw - 24px)); max-width:none; max-height:calc(100vh - 24px); max-height:calc(100dvh - 24px); border:1px solid #b89b68; border-radius:16px; background:#fffaf2; color:#443727; overflow:hidden; box-shadow:0 16px 60px #30251755; }
  dialog.bruno-mobile-filter[open] { display:flex; flex-direction:column; height:min(760px,calc(100dvh - 24px)); }
  dialog.bruno-mobile-filter::backdrop { background:rgba(36,29,20,.5); }
  .bruno-mobile-filter-head { display:flex; align-items:center; justify-content:space-between; padding:10px 16px; flex-shrink:0; border-bottom:1px solid #ddcbae; }
  .bruno-mobile-filter-head h2 { margin:0; font:600 24px/32px Georgia,serif; color:#443727; }
  .bruno-mobile-filter button { cursor:pointer; font-family:"DM Sans",Arial,sans-serif; }
  .bruno-mobile-filter-close { min-width:44px; min-height:44px; border:0; border-radius:8px; background:transparent; color:#443727; font-size:28px; line-height:32px; }
  .bruno-mobile-filter-hint { margin:0; padding:10px 16px; flex-shrink:0; font:14px/21px "DM Sans",Arial,sans-serif; color:#665641; }
  .bruno-mobile-filter-body { display:flex; flex:1; overflow:hidden; min-height:0; padding:0 16px; }
  dialog.bruno-mobile-filter #ocfilter,
  dialog.bruno-mobile-filter #ocfilter > .filter {
    display:block !important; position:static !important; inset:auto !important;
    width:100% !important; min-width:0 !important; max-width:none !important;
    height:auto !important; max-height:none !important; margin:0 !important;
    padding:0 !important; transform:none !important; visibility:visible !important;
    pointer-events:auto !important; overflow:visible !important; transition:none !important;
  }
  dialog.bruno-mobile-filter #ocfilter { display:flex !important; flex-direction:column; height:100% !important; min-height:0 !important; background:transparent; }
  dialog.bruno-mobile-filter #ocfilter > .filter { flex:1; min-height:0 !important; overflow:auto !important; overscroll-behavior:contain; background:transparent; }
  dialog.bruno-mobile-filter #ocfilter > .filter__mob,
  dialog.bruno-mobile-filter #ocfilter > .catalog-call { display:none !important; }
  dialog.bruno-mobile-filter .filter__item { margin:0; padding:0; border-bottom:1px solid #ddcbae; }
  dialog.bruno-mobile-filter .filter_toggler { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0; padding:12px 0; min-height:44px; box-sizing:border-box; font:600 16px/22px "DM Sans",Arial,sans-serif; color:#443727; cursor:pointer; }
  dialog.bruno-mobile-filter .filter_toggler svg { margin-left:auto; flex-shrink:0; }
  dialog.bruno-mobile-filter .bruno-mobile-group-summary { flex-basis:100%; font-size:14px; font-weight:400; line-height:20px; color:#7b5a25; }
  dialog.bruno-mobile-filter .bruno-mobile-group-summary:empty { display:none; }
  dialog.bruno-mobile-filter .filter__item > p,
  dialog.bruno-mobile-filter .filter__item:not(.bruno-mobile-group-open) > .filter__checkgroup,
  dialog.bruno-mobile-filter .bruno-mobile-group-hidden { display:none !important; }
  dialog.bruno-mobile-filter .bruno-mobile-group-open > .filter__checkgroup { display:block !important; height:auto !important; padding:0 0 12px !important; overflow:visible !important; }
  dialog.bruno-mobile-filter .filter__checksingle { margin:0; }
  dialog.bruno-mobile-filter .filter__checksingle label { display:flex; align-items:center; box-sizing:border-box; min-height:44px; width:100%; margin:0; padding:8px 8px 8px 28px; font:15px/22px "DM Sans",Arial,sans-serif; color:#443727; }
  dialog.bruno-mobile-filter .filter__checksingle input { flex-shrink:0; }
  dialog.bruno-mobile-filter .filter__showmore { display:inline-flex; align-items:center; min-height:44px; margin:0; font-size:14px; color:#75541f; }
  dialog.bruno-mobile-filter .bruno-mobile-group-more { width:100%; min-height:44px; margin:8px 0; padding:10px; border:1px solid #cbb58e; border-radius:8px; background:#f5ead8; color:#58432b; font-size:14px; }
  dialog.bruno-mobile-filter #ocfilter-button:not(.hidden) { display:block; order:2; flex-shrink:0; position:static !important; inset:auto !important; left:auto !important; transform:none !important; width:100%; margin:0; padding:10px 0; background:#fffaf2; z-index:2 !important; }
  dialog.bruno-mobile-filter #ocfilter-button button { min-height:48px; width:100%; padding:10px; white-space:normal; border:1px solid #a28048; border-radius:8px; background:#e9c785; color:#392d1d; font:600 15px/22px "DM Sans",Arial,sans-serif; }
  dialog.bruno-mobile-filter #ocfilter-button .disabled { opacity:.6; cursor:default; }
  .bruno-mobile-filter-foot { display:flex; gap:8px; padding:10px 16px max(10px,env(safe-area-inset-bottom)); flex-shrink:0; border-top:1px solid #ddcbae; }
  .bruno-mobile-filter-foot button { flex:1; min-height:44px; padding:10px 8px; border:1px solid #cbb58e; border-radius:8px; background:transparent; color:#58432b; font-size:14px; }
  .bruno-mobile-filter-foot button:disabled { opacity:.5; cursor:default; }
  body.bruno-mobile-filter-ready .open_filter_btn:focus-visible,
  .bruno-mobile-filter-trigger:focus-visible,
  dialog.bruno-mobile-filter :focus-visible { outline:2px solid #92621f; outline-offset:2px; }
}
