/* ======================================================================
   Rally Mega Store — Category filters v3
   Loaded after category-rms-v2.css from catalog/listing/category.tpl.
   Mobile: full-screen bottom sheet (slides up), header with active count,
   size chips, collapsible groups, sticky "see results" footer.
   Desktop: sticky column, orange price slider, collapsible groups.
   Module: pm_advancedsearch4 (markup is left untouched; the wrapper
   elements are added around #PM_ASBlockOutput_1 by filters-rms-v3.js).
   ====================================================================== */

body.page-category {
  --rms-f-ink: #151719;
  --rms-f-muted: #5b6064;
  --rms-f-line: #e4e4e1;
  --rms-f-accent: #fc4c01;
  /* accent lisible en texte sur fond clair (AA 4.5:1) et en fond de bouton */
  --rms-f-accent-ink: #b93600;
  --rms-f-paper: #fff;
  --rms-f-soft: #f5f5f2;
}

/* ------------------------------------------------------------------
   Shared: group titles are click targets (collapse), chips for sizes,
   orange slider, clearer "show all".
   ------------------------------------------------------------------ */
body.page-category #left-column .PM_ASCriterionsGroupTitle {
  align-items: center;
  border-bottom: 1px solid var(--rms-f-line);
  color: var(--rms-f-ink) !important;
  cursor: pointer;
  display: flex;
  font-size: 12px !important;
  font-weight: 800;
  justify-content: space-between;
  letter-spacing: .1em;
  margin: 0;
  min-height: 48px;
  padding: 0;
  position: relative;
  text-transform: uppercase;
  user-select: none;
}
body.page-category #left-column .PM_ASCriterionsGroupTitle::before { content: none !important; }
body.page-category #left-column .PM_ASCriterionsGroupTitle .PM_ASCriterionsGroupName { display: inline-flex; gap: 8px; align-items: center; }
body.page-category #left-column .PM_ASCriterionsGroupTitle::after {
  border: solid var(--rms-f-ink);
  border-width: 0 2px 2px 0;
  content: "";
  height: 8px;
  margin-right: 4px;
  transform: rotate(45deg) translateY(-3px);
  transition: transform .2s ease;
  width: 8px;
}
body.page-category #left-column .PM_ASCriterionsGroup.rms-collapsed .PM_ASCriterionsGroupTitle::after { transform: rotate(-135deg) translateY(-2px); }
body.page-category #left-column .PM_ASCriterionsGroup.rms-collapsed .PM_ASCriterionsGroupOuter { display: none !important; }
body.page-category #left-column .PM_ASCriterionsGroupTitle .rms-f-count {
  background: var(--rms-f-accent-ink);
  border-radius: 999px;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 18px;
  min-width: 18px;
  padding: 0 5px;
  text-align: center;
}
body.page-category #left-column .PM_ASCriterionsGroupTitle .rms-f-count:empty { display: none; }
body.page-category #left-column .PM_ASCriterionsGroupOuter { padding: 10px 0 16px !important; }

/* Un seul filet par section : celui du titre. La bordure haute ET basse du
   groupe se cumulait avec celle de la carte (doubles filets collés) et
   empilait 42px de vide en fin de groupe. */
body.page-category #left-column .PM_ASCriterionsGroup {
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.page-category #left-column .PM_ASCriterionsGroupTitle {
  margin: 0 !important;
  min-height: 46px !important;
}

/* Checkbox rows */
body.page-category #left-column .PM_ASCriterionGroupCheckbox { list-style: none; margin: 0; padding: 0; }
body.page-category #left-column .PM_ASCriterionGroupCheckbox li,
body.page-category #left-column .PM_ASCriterionGroupCheckbox .checkbox,
body.page-category #left-column .PM_ASCriterionGroupCheckbox .radio { align-items: center; display: flex; margin: 0; min-height: 44px; }
body.page-category #left-column .PM_ASCriterionGroupCheckbox li.PM_ASCriterionHide { display: none; }
body.page-category #left-column .PM_ASCriterionGroupCheckbox li.PM_ASCriterionDisable { opacity: .38; }
body.page-category #left-column .PM_ASCriterionCheckbox {
  accent-color: var(--rms-f-accent);
  flex: 0 0 18px;
  height: 18px !important;
  margin: 0 12px 0 0;
  position: relative;
  width: 18px !important;
}
body.page-category #left-column .PM_ASLabelCheckbox { align-items: center; display: flex; flex: 1; margin: 0; min-height: 44px; }
body.page-category #left-column .PM_ASLabelLink {
  align-items: center;
  color: var(--rms-f-ink) !important;
  display: flex;
  flex: 1;
  font-size: 13px !important;
  font-weight: 600;
  justify-content: space-between;
  min-height: 44px;
  text-decoration: none;
}
body.page-category #left-column .PM_ASCriterionNbProduct {
  background: var(--rms-f-soft);
  border-radius: 999px;
  color: var(--rms-f-muted) !important;
  font-size: 11px !important;
  font-weight: 700;
  margin-left: 8px;
  opacity: 1;
  padding: 2px 8px;
}

/* Size chips (attribute groups) */
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASCriterionGroupCheckbox {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-height: none !important;
  overflow: visible !important;
}
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASCriterionGroupCheckbox li { min-height: 0; }
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASCriterionGroupCheckbox li.PM_ASCriterionHide { display: none; }
body.page-category #left-column .PM_ASCriterionsGroupAttribute .checkbox { min-height: 0; position: relative; }
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASCriterionCheckbox {
  height: 100% !important;
  inset: 0;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 100% !important;
  z-index: 1;
}
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASLabelCheckbox { min-height: 0; }
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASLabelLink {
  background: var(--rms-f-paper);
  border: 1.5px solid #d9d9d5;
  border-radius: 10px;
  font-size: 13px !important;
  font-weight: 700;
  gap: 6px;
  justify-content: center;
  min-height: 42px;
  min-width: 54px;
  padding: 0 12px;
  transition: border-color .14s ease, background-color .14s ease, color .14s ease;
}
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASCriterionNbProduct { display: none; }
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASCriterionCheckbox:checked + .PM_ASLabelCheckbox .PM_ASLabelLink,
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASLabelCheckboxSelected .PM_ASLabelLink {
  background: var(--rms-f-ink);
  border-color: var(--rms-f-ink);
  color: #fff !important;
}
body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASCriterionCheckbox:focus-visible + .PM_ASLabelCheckbox .PM_ASLabelLink { outline: 2px solid var(--rms-f-accent); outline-offset: 2px; }

/* Long lists (brands): bounded scroll with a fade, not a 4-row peephole */
body.page-category #left-column .PM_ASCriterionsGroupManufacturer .PM_ASCriterionGroupCheckbox {
  max-height: 300px !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  padding-right: 4px;
  scrollbar-width: thin;
}

/* Show all / hide : bouton pleine largeur, le « + » orphelin du module est
   remplacé par un chevron (le libellé du module dit déjà l'état). */
body.page-category #left-column .PM_ASCriterionHideToggle,
body.page-category #left-column .PM_ASCriterionHideToggleClick,
body.page-category #left-column .PM_ASCriterionHideToggleHover { margin: 10px 0 0; }
body.page-category #left-column .PM_ASCriterionHideToggleLink {
  align-items: center;
  background: var(--rms-f-soft);
  border-radius: 10px;
  color: var(--rms-f-accent-ink) !important;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  justify-content: center;
  letter-spacing: .04em;
  min-height: 44px;
  padding: 0 12px;
  text-decoration: none;
  text-transform: uppercase;
  width: 100%;
}
/* Pas de chevron ici : le module en fournit un sur .PM_ASShow::before (\f107).
   En position depliee on reprend son icone haute (\f106), comme le fait
   .PM_ASHide dans son propre CSS. */
body.page-category #left-column .PM_ASCriterionsGroup.rms-f-expanded .PM_ASShow::before { content: "\f106"; }
body.page-category #left-column .PM_ASCriterionHideToggleLink::after { content: none !important; }
body.page-category #left-column .PM_ASCriterionHideToggleLink:focus-visible {
  outline: 2px solid var(--rms-f-accent);
  outline-offset: 2px;
}

/* Le module ne gère « Tout afficher » qu'au SURVOL (le clic est un simple
   preventDefault) : sur mobile, 181 marques du groupe Marque restaient donc
   inaccessibles. Le bouton pilote maintenant cet état. */
body.page-category #left-column .PM_ASCriterionsGroup.rms-f-expanded .PM_ASCriterionGroupCheckbox li.PM_ASCriterionHide {
  display: flex !important;
}

/* Selects (features) */
body.page-category #left-column .PM_ASCriterionsGroupOuter select,
body.page-category #left-column .PM_ASCriterionGroupSelect {
  appearance: none;
  background: var(--rms-f-paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23151719' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 14px center;
  border: 1.5px solid #d9d9d5;
  border-radius: 10px;
  color: var(--rms-f-ink);
  font-size: 13px;
  font-weight: 600;
  min-height: 44px;
  padding: 0 40px 0 14px;
  width: 100%;
}

/* Price slider */
body.page-category #left-column .PM_ASCritRange,
body.page-category #left-column .PM_ASCritRange.ui-slider {
  background: var(--rms-f-line);
  border: 0;
  border-radius: 999px;
  height: 6px;
  margin: 14px 14px 20px;
}
body.page-category #left-column .PM_ASCritRange .ui-slider-range { background: var(--rms-f-accent); border: 0; border-radius: 999px; }
body.page-category #left-column .PM_ASCritRange .ui-slider-handle {
  background: #fff;
  border: 2px solid var(--rms-f-accent);
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
  cursor: grab;
  height: 26px;
  margin-left: -13px;
  outline: 0;
  top: -10px;
  width: 26px;
}
body.page-category #left-column .PM_ASCritRange .ui-slider-handle::before { content: ""; inset: -8px; position: absolute; }
body.page-category #left-column .PM_ASCritRange .ui-slider-handle:focus-visible { box-shadow: 0 0 0 4px rgba(252, 76, 1, .3); }
body.page-category #left-column .PM_ASCriterionsGroupPrice .PM_ASCriterionsGroupOuter > span,
body.page-category #left-column .PM_ASCritRangeValue { color: var(--rms-f-ink); display: block; font-size: 13px; font-weight: 700; text-align: center; }

/* Reset link from the module: hidden, the wrapper has its own button */
body.page-category #left-column .PM_ASResetSearch { display: none !important; }

/* Wrapper elements (JS) */
body.page-category #left-column .rms-f-head { display: none; }
body.page-category #left-column .rms-f-foot { display: none; }
body.page-category #left-column .rms-f-clear {
  background: transparent;
  border: 0;
  color: var(--rms-f-accent-ink);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  min-height: 44px;
  padding: 0 8px;
  text-transform: uppercase;
}
body.page-category #left-column .rms-f-clear[hidden] { display: none !important; }

/* Filter button badge (mobile toolbar) */
body.page-category #rms_filter_toggler { position: relative; }
body.page-category #rms_filter_toggler .rms-f-badge {
  background: #fff;
  border-radius: 999px;
  color: var(--rms-f-accent-ink);
  font-size: 11px;
  font-weight: 800;
  line-height: 20px;
  margin-left: 8px;
  min-width: 20px;
  padding: 0 6px;
  text-align: center;
}
body.page-category #rms_filter_toggler .rms-f-badge:empty { display: none; }

/* ------------------------------------------------------------------
   Desktop: colonne filtres statique (sticky retire a la demande)
   ------------------------------------------------------------------ */
@media (min-width: 992px) {
  body.page-category #left-column { align-self: flex-start; position: static !important; top: auto !important; }
  body.page-category #left-column #PM_ASBlock_1 { max-height: none; overflow-y: visible; }
  body.page-category #left-column #PM_ASBlock_1 > .card-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding-right: 12px;
  }
  body.page-category #left-column .rms-f-head-desktop { display: flex; }
}

/* ------------------------------------------------------------------
   Mobile / tablet: full-screen bottom sheet
   ------------------------------------------------------------------ */
@media (max-width: 991px) {
  body.page-category.rms-filter-drawer-open { overflow: hidden; }

  body.page-category #rms_filter_overlay {
    background: rgba(21, 23, 25, .55);
    display: none;
    inset: 0;
    opacity: 0;
    position: fixed;
    transition: opacity .25s ease;
    z-index: 1050;
  }
  body.page-category #rms_filter_overlay.rms-filters-prep { display: block; }
  body.page-category #rms_filter_overlay.rms-filters-open { display: block; opacity: 1; }

  /* The sheet: prepared off-screen, then slid up. Every geometry rule
     from v2 (left column, 380px) is overridden here. */
  body.page-category #left-column.rms-filters-prep,
  body.page-category #left-column.rms-filters-open {
    -webkit-overflow-scrolling: touch;
    background: var(--rms-f-paper) !important;
    border-radius: 0;
    bottom: 0 !important;
    box-shadow: 0 -18px 40px rgba(0, 0, 0, .25);
    display: flex !important;
    flex-direction: column;
    height: 100dvh !important;
    left: 0 !important;
    margin: 0 !important;
    max-width: none !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: fixed !important;
    right: 0 !important;
    top: 0 !important;
    transform: translate3d(0, 100%, 0) !important;
    transition: transform .36s cubic-bezier(.16, 1, .3, 1);
    width: 100% !important;
    z-index: 1060;
  }
  body.page-category #left-column.rms-filters-open { transform: translate3d(0, 0, 0) !important; }

  /* Header */
  body.page-category #left-column .rms-f-head {
    align-items: center;
    background: var(--rms-f-paper);
    border-bottom: 1px solid var(--rms-f-line);
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
    min-height: 60px;
    padding: 0 8px 0 18px;
    padding-top: env(safe-area-inset-top);
  }
  body.page-category #left-column .rms-f-head::before {
    background: #d9d9d5;
    border-radius: 999px;
    content: "";
    height: 4px;
    left: 50%;
    position: absolute;
    top: 8px;
    transform: translateX(-50%);
    width: 40px;
  }
  body.page-category #left-column .rms-f-title {
    color: var(--rms-f-ink);
    flex: 1 1 auto;
    font-family: "Archivo Black", "Arial Black", sans-serif;
    font-size: 17px;
    letter-spacing: .04em;
    margin: 0;
    text-transform: uppercase;
  }
  body.page-category #left-column .rms-f-title .rms-f-count-total {
    background: var(--rms-f-ink);
    border-radius: 999px;
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 11px;
    letter-spacing: 0;
    line-height: 20px;
    margin-left: 8px;
    min-width: 20px;
    padding: 0 7px;
    text-align: center;
    vertical-align: middle;
  }
  body.page-category #left-column .rms-f-title .rms-f-count-total:empty { display: none; }
  body.page-category #rms_filter_close {
    align-items: center;
    background: var(--rms-f-soft);
    border: 0;
    border-radius: 10px;
    color: transparent;
    display: inline-flex;
    flex: 0 0 44px;
    font-size: 0;
    height: 44px;
    justify-content: center;
    padding: 0;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 44px;
  }
  body.page-category #rms_filter_close::before,
  body.page-category #rms_filter_close::after { background: var(--rms-f-ink); content: ""; height: 2px; position: absolute; width: 18px; }
  body.page-category #rms_filter_close::before { transform: rotate(45deg); }
  body.page-category #rms_filter_close::after { transform: rotate(-45deg); }
  body.page-category #rms_filter_close:focus-visible { outline: 2px solid var(--rms-f-accent); outline-offset: 2px; }

  /* Scrolling body */
  body.page-category #left-column .rms-f-body {
    -webkit-overflow-scrolling: touch;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 2px 18px 28px;
  }
  /* v5 est chargee APRES ce fichier, force `6px 16px 16px` sur .card-block,
     une bordure+radius sur .card et 10px sous le titre, avec 2 ID dans le
     selecteur (`body#category`) : nos surcharges doivent donc aussi porter
     `body#category` ET une classe de plus pour gagner. */
  body#category.page-category #left-column.rms-filters-open .rms-f-body .card,
  body#category.page-category #left-column.rms-filters-open .rms-f-body .card-block {
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  body#category.page-category #left-column.rms-filters-open .rms-f-body .PM_ASCriterionsGroupTitle { margin: 0 !important; }
  body.page-category #left-column #PM_ASBlockOutput_1,
  body.page-category #left-column #PM_ASBlock_1 { border: 0; margin: 0; }
  body.page-category #left-column #PM_ASBlock_1 > .card-header { display: none; }
  body.page-category #left-column #PM_ASBlock_1 > .card-block { display: block !important; padding: 0; }
  body.page-category #left-column .PM_ASMobileMode .card-block { display: block !important; }
  body.page-category #left-column .PM_ASCriterionsGroupTitle { min-height: 46px !important; }
  body.page-category #left-column .PM_ASCriterionGroupCheckbox li,
  body.page-category #left-column .PM_ASLabelCheckbox,
  body.page-category #left-column .PM_ASLabelLink { min-height: 44px; }
  body.page-category #left-column .PM_ASCriterionsGroupAttribute .PM_ASLabelLink { min-height: 46px; min-width: 60px; }
  body.page-category #left-column .PM_ASCriterionsGroupManufacturer .PM_ASCriterionGroupCheckbox { max-height: 340px !important; }

  /* Footer */
  body.page-category #left-column .rms-f-foot {
    align-items: center;
    background: var(--rms-f-paper);
    border-top: 1px solid var(--rms-f-line);
    box-shadow: 0 -10px 24px rgba(0, 0, 0, .06);
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
    padding: 12px 18px calc(12px + env(safe-area-inset-bottom));
  }
  body.page-category #left-column .rms-f-foot .rms-f-clear { flex: 0 0 auto; }
  body.page-category #left-column .rms-filter-results {
    background: var(--rms-f-accent-ink);
    border: 0;
    border-radius: 12px;
    color: #fff;
    flex: 1 1 auto;
    font-size: 14px;
    font-weight: 800;
    height: 52px;
    letter-spacing: .02em;
    transition: background-color .15s ease;
  }
  body.page-category #left-column .rms-filter-results:active { background: #9c2d00; }
  body.page-category #left-column .rms-filter-results:focus-visible { outline: 2px solid var(--rms-f-ink); outline-offset: 2px; }
  body.page-category #left-column .rms-filter-results.is-busy { opacity: .7; }

  /* The old v2 footer is replaced, never doubled. */
  body.page-category #left-column .rms-filter-footer { display: none !important; }

  /* v2 (still loaded for the grid/header rules) targets the open state with
     a higher specificity; these mirror its selectors so v3 wins. */
  body.page-category #left-column.rms-filters-open #PM_ASBlock_1 > .card-header,
  body.page-category #left-column.rms-filters-prep #PM_ASBlock_1 > .card-header { display: none !important; }
  body.page-category #left-column.rms-filters-open .PM_ASCriterionsGroupTitle {
    border-bottom: 1px solid var(--rms-f-line);
    font-size: 12px !important;
    letter-spacing: .1em;
    padding: 0;
  }
  body.page-category #left-column.rms-filters-open .PM_ASCriterionsGroupOuter { padding: 12px 0 18px !important; }
  body.page-category #left-column.rms-filters-open .PM_ASCriterionsGroupAttribute .PM_ASCriterionGroupCheckbox { max-height: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.page-category #left-column.rms-filters-prep,
  body.page-category #left-column.rms-filters-open,
  body.page-category #rms_filter_overlay { transition: none !important; }
}