/* MW PLP v1 (2026-10-15): dev-style desktop filter pills + sort pill + 4-up grid on category pages.
   Desktop only (>=1024px). Mobile keeps the existing Filter drawer + sort select.
   html.mw-plp-js is set by the head snippet; mw-plp.js moves .block.filter into the top toolbar (.mw-plp-bar). */
@media (min-width: 1024px) {
  /* ---- layout: no sidebar, full-width product column ---- */
  html.mw-plp-js body.catalog-category-view:not(#mwplp-a):not(#mwplp-b) .columns .sidebar-main { display: none !important; }
  html.mw-plp-js body.catalog-category-view:not(#mwplp-a):not(#mwplp-b) .columns .column.main { float: none !important; width: 100% !important; max-width: 100% !important; padding-left: 0 !important; }
  html.mw-plp-js body.catalog-category-view:not(#mwplp-a):not(#mwplp-b) .column.main .item-product.products-list > .row > div { flex: 0 0 33.3333% !important; max-width: 33.3333% !important; width: 33.3333% !important; }

  /* ---- toolbar row ---- */
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .toolbar-products.mw-plp-bar { display: flex !important; align-items: flex-start; gap: 12px; padding: 12px 0 !important; margin: 0 0 16px !important; border: 0 !important; background: none !important; box-shadow: none !important; position: relative; z-index: 10000001 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar::before, body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar::after { content: none !important; display: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar > .modes, body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar > .toolbar-amount, body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar > .filter-new { display: none !important; }

  /* filter block reset (it was styled as a sidebar card / mobile drawer) */
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar > .block.filter { flex: 1 1 auto; min-width: 0; float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; color: #1d1d1f !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .block.filter > .filter-title,
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-close-btn,
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-subtitle,
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .pro-btn { display: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .block-content.filter-content { display: flex !important; flex-wrap: wrap; align-items: center; gap: 10px; position: static !important; inset: auto !important; transform: none !important; width: auto !important; height: auto !important; max-height: none !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; background: none !important; border: 0 !important; box-shadow: none !important; visibility: visible !important; opacity: 1 !important; }

  /* ---- filter pills ---- */
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar #narrow-by-list { order: 1; display: flex !important; flex-wrap: wrap; align-items: center; gap: 10px; position: relative; margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-title { display: inline-flex !important; align-items: center; gap: 6px; position: relative !important; width: auto !important; min-height: 48px; margin: 0 !important; padding: 10px 18px !important; background: #fff !important; border: 1px solid rgba(5, 24, 49, .12) !important; border-radius: 999px !important; box-shadow: 0 1px 2px rgba(29, 29, 31, .04) !important; color: #1d1d1f !important; font: 800 14px/1.45 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important; letter-spacing: 0 !important; text-transform: none !important; white-space: nowrap; cursor: pointer; user-select: none; transition: border-color .15s, box-shadow .15s; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-title:hover { border-color: rgba(5, 24, 49, .3) !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-title:focus-visible { outline: 2px solid #3359a2; outline-offset: 2px; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-title.mw-open { border-color: #3359a2 !important; box-shadow: 0 0 0 1px #3359a2 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-title::before { content: none !important; display: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-title::after { content: "" !important; display: block !important; position: static !important; width: 14px !important; height: 14px !important; flex: 0 0 14px; margin: 0 !important; padding: 0 !important; border: 0 !important; color: inherit !important; background: currentColor !important; opacity: .55; font-size: 0 !important; transform: none; transition: transform .2s;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 14px 14px no-repeat; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-title.mw-open::after { transform: rotate(180deg); }

  /* ---- dropdown panel ---- */
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content { display: none !important; position: absolute !important; z-index: 60; top: 56px; left: 0; width: auto !important; min-width: 320px; max-width: min(420px, 90vw); max-height: 420px; overflow-y: auto !important; margin: 0 !important; padding: 16px 18px !important; background: #fff !important; border: 1px solid #cfd9eb !important; border-radius: 18px !important; box-shadow: 0 2px 4px rgba(23, 37, 66, .07), 0 16px 36px -10px rgba(23, 37, 66, .2) !important; color: #1d1d1f !important; text-align: left; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content.mw-open { display: block !important; height: auto !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content ol, body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content ul { display: block !important; margin: 0 !important; padding: 0 !important; list-style: none !important; columns: auto !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content li { display: block !important; margin: 0 !important; padding: 3px 0 !important; border: 0 !important; background: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content li::before, body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content a::before { content: none !important; display: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content a { display: flex !important; justify-content: space-between; align-items: center; gap: 14px; margin: 0 !important; padding: 6px 8px !important; border-radius: 8px; background: none !important; color: #1d1d1f !important; font: 400 14px/1.5 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important; text-decoration: none !important; text-transform: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content a:hover, body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content a:focus-visible { background: #f2f5fb !important; color: #1d1d1f !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content .count { flex: 0 0 auto; margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; color: #6b6b6b !important; font: 400 12px/1.5 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content .count::before { content: "(" !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content .count::after { content: ")" !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-options-content .filter-count-label { display: none !important; }

  /* ---- active filters (chips) + Clear All ---- */
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current { order: 2; margin: 0 0 0 auto !important; padding: 0 !important; background: none !important; border: 0 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current > .block-subtitle, body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current-subtitle { display: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .items { display: flex !important; flex-wrap: wrap; gap: 8px; margin: 0 !important; padding: 0 !important; list-style: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .item { display: inline-flex !important; align-items: center; gap: 4px; position: relative; min-height: 48px; margin: 0 !important; padding: 0 10px 0 16px !important; border: 0 !important; border-radius: 999px; background: #eef1f5 !important; font: 600 13px/1.4 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important; color: #1d1d1f !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .filter-label { color: #6b7280 !important; font: 500 13px/1.4 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important; text-transform: none !important; letter-spacing: 0 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .filter-label::after { content: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .filter-value { color: #1d1d1f !important; font: 700 13px/1.4 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important; text-transform: none !important; letter-spacing: 0 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .action.remove { display: inline-flex !important; align-items: center; justify-content: center; position: static !important; width: 28px; height: 28px; margin: 0 !important; padding: 0 !important; border-radius: 999px; color: #56607a !important; text-decoration: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .action.remove:hover { background: rgba(5, 24, 49, .08); color: #1d1d1f !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .action.remove > span { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .action.remove::before { content: "" !important; display: block !important; width: 15px; height: 15px; color: inherit !important; background: currentColor !important; font-size: 0 !important; margin: 0 !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E") center / 15px 15px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E") center / 15px 15px no-repeat; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-current .action.remove::after { content: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-actions { order: 3; display: flex !important; align-items: center; min-height: 48px; margin: 0 !important; padding: 0 4px !important; background: none !important; border: 0 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-actions .filter-clear { display: inline !important; margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; color: #56607a !important; font: 700 13px/1.4 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important; text-decoration: underline !important; text-underline-offset: 3px; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-actions .filter-clear:hover { color: #1d1d1f !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .filter-actions .filter-clear span { color: inherit !important; font: inherit !important; text-transform: none !important; letter-spacing: 0 !important; background: none !important; padding: 0 !important; }

  /* ---- sort pill + direction icon ---- */
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar > .toolbar-sorter { display: flex !important; align-items: center; gap: 10px; flex: 0 0 auto; float: none !important; position: relative !important; margin: 0 0 0 auto !important; padding: 0 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .sorter-label { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap; margin: 0 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar select.sorter-options { display: block !important; height: 48px !important; min-width: 200px; margin: 0 !important; padding: 0 42px 0 20px !important; border: 1px solid #cfd9eb !important; border-radius: 999px !important; box-shadow: 0 1px 2px rgba(29, 29, 31, .04) !important; color: #1d1d1f !important; font: 600 13.5px/1.2 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important; cursor: pointer; -webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center / 14px 14px !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar select.sorter-options:hover { border-color: #a9b8d6 !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .sorter-action { display: inline-flex !important; align-items: center; justify-content: center; position: relative !important; inset: auto !important; width: 40px !important; height: 40px !important; margin: 0 !important; padding: 0 !important; border-radius: 999px; background: none !important; color: #1d1d1f !important; text-decoration: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .sorter-action:hover { background: rgba(5, 24, 49, .06) !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .sorter-action > span { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .sorter-action::after { content: none !important; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .sorter-action::before { content: "" !important; display: block !important; position: static !important; width: 24px !important; height: 24px !important; margin: 0 !important; color: inherit !important; background: currentColor !important; opacity: 1 !important; filter: none !important; font-size: 0 !important; line-height: 0 !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h13M3 8h9m-9 4h9m5-4v12m0 0-4-4m4 4 4-4'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h13M3 8h9m-9 4h9m5-4v12m0 0-4-4m4 4 4-4'/%3E%3C/svg%3E") center / 24px 24px no-repeat; }
  body.mw-plp:not(#mwplp-a):not(#mwplp-b) .mw-plp-bar .sorter-action.sort-desc::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h13M3 8h9m-9 4h6m4 0 4-4m0 0 4 4m-4-4v12'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h13M3 8h9m-9 4h6m4 0 4-4m0 0 4 4m-4-4v12'/%3E%3C/svg%3E") center / 24px 24px no-repeat; }
}
@media (min-width: 1280px) {
  html.mw-plp-js body.catalog-category-view:not(#mwplp-a):not(#mwplp-b) .column.main .item-product.products-list > .row > div { flex: 0 0 25% !important; max-width: 25% !important; width: 25% !important; }
}