/* ==============================================
   30-plp.css — PLP / Archive styling (ERG v3)
   - Product cards (Loop Item)
   - PLP layout: left sidebar + right product grid
   - Category nav (Elementor Product Categories)
   - BeRocket filters (Select2, slider, reset)
   Uses tokens from 00-tokens.css only.
============================================== */


/* =========================================================
   GLOBAL GUARDS
========================================================= */

/* Header stays above everything — only target the Elementor header location wrapper.
   Do NOT add bare `header` here: Elementor can render page sections (e.g. .erg-ac-hero)
   as <header> HTML tags, which would inherit this z-index and overlap the fixed nav. */
.elementor-location-header{
  position: relative;
  z-index: 10000 !important;
}

/* Select2 dropdown above PLP (but below sticky header) */
.select2-container--open,
.select2-dropdown{
  z-index: 9998 !important;
}

/* Prevent sideways scroll on small screens */
@media (max-width: 820px){
  body.post-type-archive-product{ overflow-x: hidden; }
}


/* =========================================================
   PLP LAYOUT — Sidebar + Main
   Add these classes in Elementor:
   - Parent container:   erg-plp-layout
   - Sidebar container:  erg-plp-layout__sidebar
   - Main container:     erg-plp-layout__main
========================================================= */

/* Desktop + tablet landscape */
@media (min-width: 1024px){
  .erg-plp-layout{
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 22px !important;
    align-items: flex-start !important;
  }

  .erg-plp-layout__sidebar{
    flex: 0 0 320px !important;
    width: 320px !important;
    max-width: 320px !important;
    min-width: 0 !important;

    position: sticky;
    top: 170px; /* clears sticky header; adjust if needed */
    z-index: 4;
  }

  .erg-plp-layout__main{
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: 0 !important; /* forces flex to recalculate, overrides any Elementor inline width */
  }
}

/* Mobile + tablet portrait */
@media (max-width: 1023px){
  .erg-plp-layout{ display: block !important; }

  .erg-plp-layout__sidebar{
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 14px;
  }
}


/* =========================================================
   SIDEBAR SCROLL — whole sidebar stack (Cat nav + Filters)
   - No scrollbar unless hovered/focused
   - Works without adding any new wrapper class
========================================================= */

@media (min-width: 1024px){
  /* Sidebar scroll container */
  .erg-plp-layout__sidebar{
    max-height: calc(100vh - 150px); /* viewport minus header + breathing room */
    overflow: hidden;
    overscroll-behavior: contain;

    scrollbar-width: none;     /* Firefox hide */
    -ms-overflow-style: none;  /* legacy */
  }

  /* Scroll only when interacting */
  .erg-plp-layout__sidebar:hover,
  .erg-plp-layout__sidebar:focus-within{
    overflow: auto;
    scrollbar-width: thin; /* Firefox subtle when active */
  }

  /* WebKit scrollbar hidden unless hover/focus */
  .erg-plp-layout__sidebar::-webkit-scrollbar{ width: 0; height: 0; }
  .erg-plp-layout__sidebar:hover::-webkit-scrollbar,
  .erg-plp-layout__sidebar:focus-within::-webkit-scrollbar{ width: 10px; }

  .erg-plp-layout__sidebar:hover::-webkit-scrollbar-thumb,
  .erg-plp-layout__sidebar:focus-within::-webkit-scrollbar-thumb{
    background: rgba(255,255,255,.14);
    border-radius: 999px;
    border: 3px solid rgba(0,0,0,0);
    background-clip: padding-box;
  }

  /* IMPORTANT: ensure inner panels don't create "double scroll" */
  .erg-br-filters{
    max-height: none !important;
    overflow: visible !important;
  }
}


/* =========================================================
   ELEMENTOR LOOP GRID — stable breakpoints
========================================================= */

@media (min-width: 1100px){
  .erg-plp-layout__main .elementor-widget-loop-grid .e-loop-container{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
  }
}

@media (min-width: 768px) and (max-width: 1099px){
  .erg-plp-layout__main .elementor-widget-loop-grid .e-loop-container{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }
}

@media (max-width: 767px){
  .erg-plp-layout__main .elementor-widget-loop-grid .e-loop-container{
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}


/* =========================================================
   PRODUCT CARD — Steel/Range v2
   Scope: .erg-plp-card.erg-card
========================================================= */

.erg-plp-card.erg-card{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;

  padding: 16px 16px 14px;
  border-radius: 16px;
  overflow: hidden;

  background:
    radial-gradient(120% 80% at 20% 0%, rgba(255,255,255,.035) 0, rgba(255,255,255,0) 60%),
    var(--erg-panel);

  border: 1px solid var(--erg-line);
  box-shadow: 0 14px 30px rgba(0,0,0,.55);

  transition: transform .18s ease-out, box-shadow .18s ease-out, border-color .18s ease-out;
}

@media (hover:hover){
  .erg-plp-card.erg-card:hover{
    transform: translateY(-3px);
    box-shadow: 0 22px 38px rgba(0,0,0,.70);
    border-color: rgba(255,255,255,.14);
  }
}

/* Legacy image wrapper (kept for older templates) */
.erg-card__image{
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: #0f1216;
}

.erg-card__image img{
  display: block;
  width: 100%;
  height: auto;
  will-change: transform;
  transition: transform .22s ease-out, filter .22s ease-out;
}

@media (hover:hover){
  .erg-plp-card:hover .erg-card__image img{
    transform: scale(1.03);
    filter: brightness(1.06);
  }
}

/* Title clamp */
.erg-card__title{ margin-top: 10px; }

.erg-card__title :is(.product_title, h3, a){
  font-family: var(--erg-head);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1.22;

  color: var(--erg-text);
  text-decoration: none;

  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;

  min-height: calc(1.22em * 3);
}

@media (hover:hover){
  .erg-card__title a:hover{ text-decoration: underline; }
}

/* Price (fallback) */
.erg-card__price{ margin-top: 4px; }

.erg-card__price :is(.woocommerce-Price-amount, .woocommerce-Price-amount bdi){
  font-family: var(--erg-head);
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--erg-text);
}

.erg-card__price del{
  opacity: .55;
  margin-right: 6px;
  color: var(--erg-text-dim);
}
.erg-card__price ins{ text-decoration: none; }

/* Meta lines */
.erg-card__meta{
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  gap: 2px;

  font-size: 12px;
  line-height: 1.4;
}
.erg-card__meta p{ margin: 0; }

.erg-meta-line--primary{
  color: color-mix(in oklab, var(--erg-text) 86%, transparent);
  font-weight: 600;
}
.erg-meta-line--secondary{ color: var(--erg-text-dim); }

.erg-meta-line--upc{
  color: color-mix(in oklab, var(--erg-text) 45%, transparent);
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 11px;
}

/* Actions */
.erg-card__actions{
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  align-items: stretch;
}

.erg-card__actions :is(.elementor-button, .single_add_to_cart_button){
  width: 100%;
  justify-content: center;

  border-radius: 999px;
  padding: 12px 18px;

  font-size: clamp(12px, .9rem, 14px);
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;

  background: linear-gradient(180deg, var(--erg-cta), var(--erg-cta-2));
  color: var(--erg-cta-contrast);

  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 10px 22px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.12);

  transition: transform .14s, box-shadow .14s, background .14s;
}

@media (hover:hover){
  .erg-card__actions :is(.elementor-button, .single_add_to_cart_button):hover{
    transform: translateY(-1px);
    background: linear-gradient(180deg, var(--erg-cta-2), var(--erg-cta-3));
    box-shadow: 0 16px 28px rgba(0,0,0,.65), inset 0 0 0 1px rgba(255,255,255,.14);
  }
}

.erg-card__actions :is(.button, .add_to_cart_button){ width: 100%; }

/* Secondary button */
.erg-card__secondary-btn .elementor-button{
  width: 100%;
  justify-content: center;

  border-radius: 999px;
  padding: 12px 18px;

  font-size: clamp(12px, .9rem, 14px);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;

  background: transparent;
  border: 1px solid var(--erg-line);
  color: var(--erg-text);

  box-shadow: none;
  transition: transform .14s, box-shadow .14s, border-color .14s, background .14s;
}

@media (hover:hover){
  .erg-card__secondary-btn .elementor-button:hover{
    border-color: color-mix(in srgb, var(--erg-link) 60%, transparent);
    background: color-mix(in srgb, var(--erg-link) 12%, transparent);
    box-shadow: 0 10px 24px rgba(0,0,0,.45);
    transform: translateY(-1px);
  }
}

/* Icon spacing in Elementor buttons */
.erg-card__actions .elementor-button .elementor-button-icon{
  margin-inline-end: 10px;
  line-height: 0;
}

@media (max-width: 880px){
  .erg-card__actions{ grid-template-columns: 1fr; }
}

@media (max-width: 768px){
  .erg-plp-card.erg-card{
    padding: 14px 14px 12px;
    border-radius: 14px;
  }

  .erg-card__title :is(.product_title, h3, a){
    font-size: 16px;
    -webkit-line-clamp: 3;
    min-height: calc(1.22em * 3);
  }

  .erg-card__price :is(.woocommerce-Price-amount, .woocommerce-Price-amount bdi){
    font-size: 16px;
  }
}

/* A11y focus */
.erg-plp-card.erg-card :is(a, button):focus-visible{
  outline: 2px solid var(--erg-red);
  outline-offset: 2px;
  border-radius: 8px;
}


/* =========================================================
   PLP IMAGE FRAME (if you use erg-card__thumb on the image widget)
========================================================= */

.erg-plp-card .erg-card__thumb .elementor-widget-container{
  aspect-ratio: 4 / 3;
  min-height: 190px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;

  background: #0f1216;
  border-radius: 12px;
  overflow: hidden;
}

.erg-plp-card .erg-card__thumb :is(figure, .wp-caption){
  margin: 0;
  width: 100%;
  height: 100%;
}

.erg-plp-card .erg-card__thumb a{
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.erg-plp-card .erg-card__thumb img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  will-change: transform;
  transition: transform .22s ease-out, filter .22s ease-out;
}

@media (hover:hover){
  .erg-plp-card:hover .erg-card__thumb img{
    transform: scale(1.03);
    filter: brightness(1.06);
  }
}


/* =========================================================
   PLP SALE BADGE (JetWooBuilder) — wrapper transparency + pill
========================================================= */

.erg-plp-card .erg-card__sale-badge,
.erg-plp-card .erg-card__sale-badge .elementor-widget-container,
.erg-plp-card .erg-card__sale-badge .jet-woo-builder-archive-product-sale-badge{
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.erg-plp-card .erg-card__sale-badge::before,
.erg-plp-card .erg-card__sale-badge::after{
  content: none !important;
  display: none !important;
}

.erg-plp-card .erg-card__sale-badge .jet-woo-product-badge__sale,
.erg-plp-card .erg-card__sale-badge .jet-woo-product-badge__sale *{
  background: transparent !important;
  box-shadow: none !important;
}

.erg-plp-card .erg-card__sale-badge .jet-woo-product-badge.jet-woo-product-badge__sale{
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 8px 14px !important;
  border-radius: 999px !important;

  background: var(--erg-red) !important;
  background-image: linear-gradient(180deg, #f04a4a, #b82d2d) !important;

  border: 1px solid rgba(0,0,0,.25) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.14) !important;

  color: #fff !important;
  font-family: var(--erg-head) !important;
  font-weight: 900 !important;
  font-size: 11px !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  font-variant-numeric: tabular-nums !important;

  white-space: nowrap !important;
  max-width: calc(100% - 24px);
}

.erg-plp-card .erg-card__sale-badge .jet-woo-product-badge__sale::after{
  content: "" !important;
  position: absolute;
  left: 2px; right: 2px; top: 2px;
  height: 45%;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0)) !important;
  pointer-events: none !important;
}


/* =========================================================
   PLP SALE BADGE — new .erg-sale-pct (replaces Jet badge)
========================================================= */

.erg-plp-card .erg-sale-pct{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 6px 12px;
  border-radius: 999px;

  background: var(--erg-red);
  background-image: linear-gradient(180deg, #f04a4a, #b82d2d);

  border: 1px solid rgba(0,0,0,.25);
  box-shadow: 0 14px 34px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.14);

  color: #fff;
  font-family: var(--erg-head);
  font-weight: 900;
  font-size: 11px;
  line-height: 1;
  letter-spacing: .10em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;

  white-space: nowrap;
  max-width: calc(100% - 24px);
}

.erg-plp-card .erg-sale-pct::after{
  content: "";
  position: absolute;
  left: 2px; right: 2px; top: 2px;
  height: 45%;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0));
  pointer-events: none;
}

/* Transparent wrapper layers around new shortcode badge */
.erg-plp-card .erg-card__sale-badge .elementor-shortcode{
  background: transparent !important;
  padding: 0 !important;
}


/* =========================================================
   PLP PRICE (if you use erg-card__priceval on the Price widget)
========================================================= */

.erg-plp-card .erg-card__priceval .price{
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0;
}

.erg-plp-card .erg-card__priceval .price ins{ text-decoration: none; }

.erg-plp-card .erg-card__priceval .price ins :is(.woocommerce-Price-amount, .woocommerce-Price-amount bdi){
  font-family: var(--erg-head);
  font-size: 18px;
  font-weight: 900;
  letter-spacing: .06em;
  color: var(--erg-text);
}

.erg-plp-card .erg-card__priceval .price del{
  opacity: .65;
  color: var(--erg-text-dim);
  text-decoration-thickness: 2px;
  text-decoration-color: rgba(255,255,255,.35);
  margin: 0;
}

.erg-plp-card .erg-card__priceval .price del :is(.woocommerce-Price-amount, .woocommerce-Price-amount bdi){
  font-family: var(--erg-head);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .05em;
}

.erg-plp-card .erg-card__priceval .price > :is(.woocommerce-Price-amount, .woocommerce-Price-amount bdi){
  font-family: var(--erg-head);
  font-size: 18px;
  font-weight: 900;
  letter-spacing: .06em;
  color: var(--erg-text);
}


/* =========================================================
   PLP META: category links — dotted underline
========================================================= */

.erg-plp-card .erg-card__meta a{
  display: inline-block;
  color: rgba(255,255,255,.80);
  text-decoration-line: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  text-decoration-color: rgba(255,255,255,.35);
  transition: color .14s, transform .14s, text-decoration-color .14s;
}

@media (hover:hover){
  .erg-plp-card .erg-card__meta a:hover{
    color: #fff;
    text-decoration-color: rgba(255,255,255,.65);
    transform: translateY(-1px);
  }
}

.erg-plp-card .erg-card__meta a:focus-visible{
  outline: 2px solid var(--erg-red);
  outline-offset: 2px;
  border-radius: 6px;
}


/* =========================================================
   CATEGORY NAV (Elementor Product Categories widget)
   Class is set on the widget: erg-catnav
   (Images hidden; pills stacked tightly)
========================================================= */

.erg-catnav{
  margin-bottom: 14px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid var(--erg-line);
  background:
    radial-gradient(120% 80% at 20% 0%, rgba(255,255,255,.03) 0, rgba(255,255,255,0) 60%),
    var(--erg-panel);
  box-shadow: 0 18px 50px rgba(0,0,0,.30);
}

/* Force stacked list + kill Elementor gaps/margins */
.erg-catnav ul.products{
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;

  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

.erg-catnav li.product-category,
.erg-catnav li.product-category:hover{
  margin: 0 !important;
  padding: 0 !important;
  /* The theme makes each li its OWN card: panel background, 1px border, and a
     16px radius sitting behind the <a> pill's 12px radius. That border/radius
     mismatch was the "weird corners," and its hover transform + drop-shadow was
     the raise. Flatten the li completely so ONLY the <a> pill renders — exactly
     like the search facet. */
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
  box-shadow: none !important;
  transition: none !important;
}

/* Pill — match the search facet rows exactly (padding, radius, no movement) */
.erg-catnav li.product-category > a{
  display: block;
  margin: 0 !important;
  padding: 9px 12px !important;

  border-radius: 12px !important;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
  text-decoration: none;

  /* Kill the theme's hover lift/scale — the search facet doesn't move. */
  transform: none !important;
  box-shadow: none !important;

  transition: background .14s ease, border-color .14s ease, color .14s ease;
}

/* Pill spacing (ONLY source of spacing) */
.erg-catnav li.product-category + li.product-category{
  margin-top: 6px !important; /* change to 4px if you want tighter */
}

/* Hide category thumbs (placeholders are ugly + inconsistent) */
.erg-catnav li.product-category > a > img{
  display: none !important;
}

/* Title + count */
.erg-catnav .woocommerce-loop-category__title{
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.2 !important;

  /* Match the search facet rows: name left, count pill right, white body text.
     !important needed — the wc-categories widget applies element-ID-scoped
     heading styles (uppercase 16px) that outrank class selectors. */
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;

  font-family: var(--erg-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;

  color: var(--erg-text) !important;
  transition: color .14s ease;
}

.erg-catnav .woocommerce-loop-category__title mark.count{
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 2px 9px !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,.62) !important;
  font-family: var(--erg-mono) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
}

@media (hover:hover){
  .erg-catnav li.product-category > a:hover{
    background: rgba(0,0,0,.26);
    border-color: var(--erg-cta, #C8A84B);
    /* stay put — no lift/scale/shadow like the theme default */
    transform: none !important;
    box-shadow: none !important;
  }
  /* gold on hover (not the theme's purple link-hover) */
  .erg-catnav li.product-category > a:hover .woocommerce-loop-category__title{
    color: var(--erg-cta, #C8A84B) !important;
  }
}

/* Focus */
.erg-catnav li.product-category > a:focus-visible{
  outline: 2px solid rgba(74,163,181,.25);
  outline-offset: 2px;
}


/* =========================================================
   BeRocket Filters — panel + controls
   Scope: .erg-br-filters
========================================================= */

.erg-br-filters{
  font-size: 13px;
  line-height: 1.35;

  padding: 18px;
  border-radius: 18px;
  border: 1px solid var(--erg-line);

  background:
    radial-gradient(120% 80% at 20% 0%, rgba(255,255,255,.03) 0, rgba(255,255,255,0) 60%),
    var(--erg-panel);

  box-shadow: 0 18px 50px rgba(0,0,0,.30);
}

/* Prevent global Elementor heading styles from exploding labels */
.erg-br-filters :is(h1,h2,h3,h4,h5,h6){
  all: unset;
  display: block;
}

.erg-br-filters :is(.bapf_head, .bapf_title, .bapf_head h3){
  margin: 0 0 8px !important;
  font-family: var(--erg-head) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  line-height: 1.2 !important;
  color: rgba(255,255,255,.78) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}

/* Filter block spacing */
.erg-br-filters :is(.bapf_sfilter, .bapf_filter, .bapf_filter_block){
  margin: 0 0 18px !important;
}

.erg-br-filters :is(.bapf_sfilter, .bapf_filter, .bapf_filter_block):last-child{
  margin-bottom: 0 !important;
}


/* =========================================================
   Select2 / Select — closed control styling (ERG-dark)
========================================================= */

.erg-br-filters :is(select, .select2-container){
  width: 100% !important;
}

/* Native select */
.erg-br-filters select{
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-image: none !important;

  width: 100% !important;
  min-height: 44px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(0,0,0,.22) !important;
  color: rgba(255,255,255,.92) !important;

  padding: 10px 56px 10px 14px !important;
  font-family: var(--erg-body) !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

/* Space after each control (separates next label block) */
.erg-br-filters :is(.select2-container, select){
  margin-bottom: 14px !important;
}

/* Select2 container */
.erg-br-filters .select2-container{
  width: 100% !important;
  max-width: 100% !important;
}

/* Select2 selection */
.erg-br-filters .select2-container .select2-selection{
  position: relative !important;

  height: 44px !important;
  min-height: 44px !important;
  width: 100% !important;

  border-radius: 12px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(0,0,0,.22) !important;

  box-sizing: border-box !important;
  overflow: hidden !important;

  display: flex !important;
  align-items: center !important;
}

.erg-br-filters .select2-container .select2-selection__rendered{
  height: 44px !important;
  display: flex !important;
  align-items: center !important;

  padding-left: 14px !important;
  padding-right: 64px !important;

  color: rgba(255,255,255,.92) !important;
  font-family: var(--erg-body) !important;
  font-size: 14px !important;
  line-height: 1 !important;

  box-sizing: border-box !important;
}

.erg-br-filters .select2-container .select2-selection__placeholder{
  color: rgba(255,255,255,.60) !important;
}

/* Kill theme pseudo-arrows */
.erg-br-filters :is(.bapf_sfilter, .bapf_filter, .bapf_filter_block)
  :is(.select2-selection, .select2-selection__rendered)::after{
  content: none !important;
  display: none !important;
}

/* Arrow area */
.erg-br-filters .select2-container .select2-selection__arrow{
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;

  width: 56px !important;
  height: 44px !important;

  border-left: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.06) !important;

  border-top-right-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
}

/* Hide Select2 default triangle */
.erg-br-filters .select2-container .select2-selection__arrow b{
  display: none !important;
}

/* Draw white chevron */
.erg-br-filters .select2-container .select2-selection__arrow::before{
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 18px;
  height: 18px;

  background: rgba(255,255,255,.92);

  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6.7 8.7a1 1 0 0 1 1.4 0L12 12.6l3.9-3.9a1 1 0 1 1 1.4 1.4l-4.6 4.6a1 1 0 0 1-1.4 0L6.7 10.1a1 1 0 0 1 0-1.4Z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6.7 8.7a1 1 0 0 1 1.4 0L12 12.6l3.9-3.9a1 1 0 1 1 1.4 1.4l-4.6 4.6a1 1 0 0 1-1.4 0L6.7 10.1a1 1 0 0 1 0-1.4Z'/%3E%3C/svg%3E") center / contain no-repeat;

  opacity: .92;
}

/* Hover / active */
@media (hover:hover){
  .erg-br-filters :is(select, .select2-container .select2-selection):hover{
    border-color: rgba(255,255,255,.22) !important;
    background: rgba(0,0,0,.26) !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.45) !important;
  }

  .erg-br-filters .select2-container .select2-selection:hover .select2-selection__arrow{
    background: rgba(255,255,255,.10) !important;
  }

  .erg-br-filters .select2-container .select2-selection:hover .select2-selection__arrow::before{
    opacity: 1;
  }
}

.erg-br-filters .select2-container--open .select2-selection{
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.55) !important;
}

.erg-br-filters .select2-container--open .select2-selection__arrow{
  background: rgba(255,255,255,.12) !important;
}


/* =========================================================
   Select2 — MULTI-SELECT chosen tokens (e.g. Brand filter)
   The single-select rules above fix the control at height:44px
   with overflow:hidden, which clips the chosen pill and leaves
   it with no on-brand styling. Override for the multiple case so
   tokens read as dark-steel + gold pills and can wrap/grow.
========================================================= */

/* Let the control grow with chosen tokens instead of clipping */
.erg-br-filters .select2-container .select2-selection--multiple{
  height: auto !important;
  min-height: 44px !important;
  overflow: visible !important;

  padding: 5px 58px 5px 6px !important; /* keep clear of the absolute chevron */
  align-items: center !important;
  flex-wrap: wrap !important;
}

.erg-br-filters .select2-container .select2-selection--multiple
  .select2-selection__rendered{
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;

  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
}

/* The chosen pill — dark steel + gold accent (on-brand) */
.erg-br-filters .select2-selection__choice{
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;

  margin: 0 !important;
  padding: 5px 11px !important;
  max-width: 100% !important;

  border-radius: var(--erg-radius-sm, 12px) !important;
  border: 1px solid rgba(200,168,75,.45) !important;  /* gold-tinted */
  background: rgba(0,0,0,.30) !important;             /* dark steel */

  color: var(--erg-text, #f2f4f6) !important;
  font-family: var(--erg-body) !important;
  font-size: 13px !important;
  line-height: 1.25 !important;

  white-space: normal !important;        /* allow long brand names to wrap */
  overflow-wrap: anywhere !important;
}

/* Label text (Select2 4.1 wraps it in __display; 4.0 is a raw node) */
.erg-br-filters .select2-selection__choice__display{
  padding: 0 !important;
  color: inherit !important;
}

/* The × remove control */
.erg-br-filters .select2-selection__choice__remove{
  flex: 0 0 auto !important;
  width: 16px !important;
  height: 16px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border: 0 !important;
  background: transparent !important;
  border-radius: 999px !important;

  color: var(--erg-text-dim, #bdc3cc) !important;
  font-size: 16px !important;
  line-height: 1 !important;
}

@media (hover:hover){
  .erg-br-filters .select2-selection__choice:hover{
    border-color: rgba(200,168,75,.75) !important;
    background: rgba(0,0,0,.36) !important;
  }
  .erg-br-filters .select2-selection__choice__remove:hover{
    color: var(--erg-cta-hover, #d4b65c) !important;
    background: rgba(200,168,75,.16) !important;
  }
}


/* =========================================================
   BeRocket "Selected Filters" widget (chips + Unselect all)
   Default skin = bapf-sfa-grey-rounded: grey 2px ovals with #333
   text (low contrast on dark), a left fa-times AND a right
   ::before "+" pseudo rotated into a 2nd × → double-×. Re-skin
   to the dark-steel + gold token system, single × on the left.
========================================================= */

/* Chip list layout */
.berocket_aapf_widget_selected_area .bapf_sfa_taxonomy{
  margin: 0 0 8px !important;
}
.berocket_aapf_widget_selected_area .bapf_sfa_taxonomy ul{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.berocket_aapf_widget_selected_area .bapf_sfa_taxonomy li{
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Each removable chip — dark steel + gold (matches Brand token) */
.berocket_aapf_widget_selected_area .braapf_unselect{
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;

  padding: 5px 11px !important;   /* drops the skin's 30px right reserve */
  width: auto !important;

  border-radius: var(--erg-radius-sm, 12px) !important;
  border: 1px solid rgba(200,168,75,.45) !important;
  background: rgba(0,0,0,.30) !important;

  color: var(--erg-text, #f2f4f6) !important;
  font-family: var(--erg-body) !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  text-decoration: none !important;

  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

/* Kill the skin's right-side "+" pseudo-× */
.berocket_aapf_widget_selected_area .braapf_unselect::before,
.berocket_aapf_widget_selected_area .braapf_unselect::after{
  content: none !important;
  display: none !important;
}

/* The fa-times × (left, inside the link) */
.berocket_aapf_widget_selected_area .braapf_unselect .fa-times{
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  color: var(--erg-text-dim, #bdc3cc) !important;
}

@media (hover:hover){
  .berocket_aapf_widget_selected_area .braapf_unselect:hover{
    border-color: rgba(200,168,75,.75) !important;
    background: rgba(0,0,0,.36) !important;
  }
  .berocket_aapf_widget_selected_area .braapf_unselect:hover .fa-times{
    color: var(--erg-cta-hover, #d4b65c) !important;
  }
}

/* "Unselect all" — quiet text link, not a pill */
.berocket_aapf_widget_selected_area .bapf_sfa_unall{
  margin: 10px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.berocket_aapf_widget_selected_area .braapf_unselect_all{
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;

  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;

  color: var(--erg-text-dim, #bdc3cc) !important;
  font-family: var(--erg-body) !important;
  font-size: 12px !important;
  text-decoration: none !important;
}
.berocket_aapf_widget_selected_area .braapf_unselect_all::before,
.berocket_aapf_widget_selected_area .braapf_unselect_all::after{
  content: none !important;
  display: none !important;
}
.berocket_aapf_widget_selected_area .braapf_unselect_all .fa-times{
  font-size: 11px !important;
  color: inherit !important;
}
@media (hover:hover){
  .berocket_aapf_widget_selected_area .braapf_unselect_all:hover,
  .berocket_aapf_widget_selected_area .braapf_unselect_all:hover .fa-times{
    color: var(--erg-cta-hover, #d4b65c) !important;
  }
}


/* =========================================================
   Select2 dropdown — WHITE (readable)
========================================================= */

.select2-container--open .select2-dropdown,
.select2-container--open .select2-results,
.select2-container--open .select2-results__options{
  background: #fff !important;
}

.select2-container--open .select2-dropdown{
  box-sizing: border-box !important;
  margin-top: 6px !important;

  border-radius: 14px !important;
  overflow: hidden !important;

  border: 1px solid rgba(0,0,0,.14) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.45) !important;
}

.select2-search--dropdown{
  padding: 8px !important;
  background: #fff !important;
  border-bottom: 1px solid rgba(0,0,0,.08) !important;
}

.select2-search--dropdown .select2-search__field{
  width: 100% !important;
  border-radius: 10px !important;
  border: 1px solid rgba(0,0,0,.16) !important;
  background: #fff !important;
  color: #111 !important;
  padding: 8px 10px !important;
  font-size: 14px !important;
  outline: none !important;
}

.select2-results__options{
  padding: 4px !important;
  max-height: 300px !important;
  scrollbar-color: rgba(0,0,0,.25) rgba(0,0,0,.06);
}

.select2-results__option{
  padding: 8px 10px !important;
  margin: 1px 0 !important;
  border-radius: 8px !important;

  font-size: 13px !important;
  line-height: 1.15 !important;

  color: #111 !important;
  background: #fff !important;
}

.select2-results__option--highlighted[aria-selected]{
  background: rgba(0,0,0,.06) !important;
  color: #111 !important;
}

.select2-results__option[aria-selected="true"]{
  background: rgba(0,0,0,.10) !important;
  color: #111 !important;
  font-weight: 600 !important;
}

.select2-results__options::-webkit-scrollbar{ width: 10px; }
.select2-results__options::-webkit-scrollbar-track{ background: rgba(0,0,0,.06); }
.select2-results__options::-webkit-scrollbar-thumb{
  background: rgba(0,0,0,.22);
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.06);
}


/* =========================================================
   Price slider — readable numbers + track
========================================================= */

.erg-br-filters :is(.bapf_from, .bapf_to, .bapf_price_slider_amount){
  color: rgba(255,255,255,.72) !important;
  font-family: var(--erg-body) !important;
  font-size: 13px !important;
  letter-spacing: .02em !important;
  font-variant-numeric: tabular-nums !important;
}

.erg-br-filters .ui-slider{
  background: rgba(255,255,255,.10) !important;
  border: 0 !important;
  height: 4px !important;
  border-radius: 999px !important;
}

.erg-br-filters .ui-slider-range{
  background: rgba(255,255,255,.28) !important;
}

.erg-br-filters .ui-slider-handle{
  width: 18px !important;
  height: 18px !important;
  top: -7px !important;

  border-radius: 999px !important;
  border: 2px solid rgba(255,255,255,.75) !important;
  background: #0f1318 !important;

  box-shadow: 0 10px 22px rgba(0,0,0,.55) !important;
}


/* =========================================================
   Reset button
========================================================= */

.erg-br-filters :is(.bapf_reset, .bapf_reset_button){
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  margin-top: 6px !important;

  border-radius: 14px !important;
  padding: 12px 14px !important;

  font-family: var(--erg-head) !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;

  color: rgba(255,255,255,.92) !important;
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.45) !important;

  outline: none !important;
}

@media (hover:hover){
  .erg-br-filters :is(.bapf_reset, .bapf_reset_button):hover{
    background: rgba(255,255,255,.10) !important;
    border-color: rgba(255,255,255,.22) !important;
    transform: translateY(-1px);
  }
}

.erg-br-filters :is(.bapf_reset, .bapf_reset_button):focus-visible{
  outline: 2px solid rgba(255,255,255,.28) !important;
  outline-offset: 2px !important;
}

/* =========================================
   ERG PLP TOOLBAR (JetWoo: Result Count + Ordering)
   Minimal + readable + not chunky
   ========================================= */

.erg-plp-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;

  padding: 8px 12px;
  margin: 10px 0 14px;

  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);

  background:
    radial-gradient(900px 220px at 18% 0%, rgba(62,122,141,.10), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(0,0,0,.18));

  box-shadow: 0 14px 44px rgba(0,0,0,.45);
}

/* Make sure nothing inside forces height */
.erg-plp-toolbar,
.erg-plp-toolbar *{
  min-height: 0;
}

/* Result count (left) — target both JetWoo class and our custom class */
.erg-plp-toolbar .jet-woo-products-result-count,
.erg-plp-toolbar .jet-woo-products-result-count *,
.erg-plp-toolbar .erg-plp-toolbar__count,
.erg-plp-toolbar .erg-plp-toolbar__count *,
.erg-plp-toolbar [class*="result-count"],
.erg-plp-toolbar [class*="result-count"] *{
  margin: 0 !important;
  font-family: var(--erg-body);
  font-size: 14px;
  line-height: 1.2;
  color: rgba(242,244,246,.82) !important;
  opacity: 1;
}

/* Ordering wrapper — remove JetWoo/Elementor width caps */
.erg-plp-toolbar .jet-woo-products-ordering,
.erg-plp-toolbar .jet-woo-products-ordering form,
.erg-plp-toolbar .erg-plp-toolbar__sort,
.erg-plp-toolbar .erg-plp-toolbar__sort *:not(select):not(option),
.erg-plp-toolbar [class*="products-ordering"],
.erg-plp-toolbar [class*="products-ordering"] *:not(select):not(option),
.erg-plp-toolbar .woocommerce-ordering{
  margin: 0 !important;
  max-width: none !important;
  width: auto !important;
}

/* Ordering select (right) */
.erg-plp-toolbar .jet-woo-products-ordering,
.erg-plp-toolbar .erg-plp-toolbar__sort,
.erg-plp-toolbar [class*="products-ordering"],
.erg-plp-toolbar .woocommerce-ordering{
  position: relative;
  flex-shrink: 0 !important;  /* don't let flexbox crush the sort pill */
}

.erg-plp-toolbar select{
  appearance: none;
  -webkit-appearance: none;

  font-family: var(--erg-mono);
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: 13px;

  color: rgba(242,244,246,.90);
  background: rgba(0,0,0,.18);

  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;

  padding: 10px 46px 10px 16px;
  height: 42px;
  width: auto;           /* let select size to its content  */
  min-width: 280px;      /* ensure longest option text fits (mono + .16em tracking) */
  max-width: 100%;       /* don't blow out on mobile        */

  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}

/* Chevron */
.erg-plp-toolbar .jet-woo-products-ordering::after,
.erg-plp-toolbar .woocommerce-ordering::after,
.erg-plp-toolbar .erg-plp-toolbar__sort .elementor-shortcode::after{
  content:"";
  position:absolute;
  right: 16px;
  top: 50%;
  width: 9px;
  height: 9px;
  border-right: 2px solid rgba(242,244,246,.72);
  border-bottom: 2px solid rgba(242,244,246,.72);
  transform: translateY(-60%) rotate(45deg);
  pointer-events:none;
  opacity: .9;
}

/* Hover */
.erg-plp-toolbar select:hover{
  border-color: rgba(255,255,255,.20);
}

/* Mobile: stack */
@media (max-width: 767px){
  .erg-plp-toolbar{
    flex-direction: column;
    align-items: stretch;
  }
  .erg-plp-toolbar select{
    width: 100%;
  }
}

/* =========================================================
   PLP ATC (shortcode form) — qty + button
========================================================= */

.erg-card__actions form.erg-plp-cart{
  margin: 0;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 10px;
  align-items: stretch;
}

.erg-card__actions form.erg-plp-cart .quantity{
  margin: 0;
}

.erg-card__actions form.erg-plp-cart input.qty{
  width: 100%;
  height: 44px;
  padding: 0 10px;

  border-radius: 14px;
  border: 1px solid var(--erg-line);
  background: rgba(0,0,0,.22);
  color: rgba(255,255,255,.92);

  font-family: var(--erg-mono);
  font-weight: 800;
  letter-spacing: .06em;
  text-align: center;

  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
  outline: none;
}

.erg-card__actions form.erg-plp-cart button.single_add_to_cart_button{
  height: 44px;

  font-family: var(--erg-head);
  font-weight: 900;
  letter-spacing: .10em; /* prevents the “weird spaced” look */
}

/* Optional: subtle loading state */
.erg-card__actions form.erg-plp-cart.is-loading{
  opacity: .85;
  pointer-events: none;
}


/* =========================================================
   MOBILE FILTER LABELS — tighter association + visibility
   On mobile the sidebar stacks vertically; make sure each
   filter label clearly "owns" its dropdown.
========================================================= */

@media (max-width: 1023px){

  /* Compact vertical rhythm — label + control form a tight unit */
  .erg-br-filters :is(.bapf_sfilter, .bapf_filter, .bapf_filter_block){
    margin: 0 0 12px !important;
    padding: 10px 12px !important;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: var(--erg-radius-sm);
    background: rgba(0,0,0,.18);
  }

  /* Label: a bit larger, more visible on mobile */
  .erg-br-filters :is(.bapf_head, .bapf_title, .bapf_head h3){
    font-size: 12px !important;
    margin: 0 0 6px !important;
    color: var(--erg2-text-muted) !important;
  }

  /* Remove extra bottom-margin that desktop uses for spacing */
  .erg-br-filters :is(.select2-container, select){
    margin-bottom: 0 !important;
  }

  /* Horizontal layout: filters sit side-by-side on wider phones */
  @media (min-width: 480px){
    .erg-br-filters{
      display: flex !important;
      flex-wrap: wrap !important;
      gap: 10px !important;
    }
    .erg-br-filters :is(.bapf_sfilter, .bapf_filter, .bapf_filter_block){
      flex: 1 1 calc(33.333% - 10px);
      min-width: 140px;
    }
  }
}


/* =========================================================
   PLP PAGINATION
========================================================= */

/* Wrapper */
.elementor-pagination,
nav.e-load-more-anchor,
.e-pagination-previous-next {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 28px 0 12px;
  flex-wrap: wrap;
}

/* Number links + prev/next */
.elementor-pagination .page-numbers,
.e-pagination-previous-next a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid var(--erg-line, rgba(255,255,255,.10));
  background: var(--erg-panel, #11151a);
  color: var(--erg-text-dim, #a9afb9);
  font-family: var(--erg-mono, 'JetBrains Mono', monospace);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  text-decoration: none;
  transition: all .15s ease;
}

/* Hover */
.elementor-pagination .page-numbers:hover:not(.current):not(.dots),
.e-pagination-previous-next a:hover {
  border-color: rgba(255,255,255,.22);
  color: var(--erg-text, #f2f4f6);
  background: rgba(255,255,255,.06);
}

/* Active / Current page */
.elementor-pagination .page-numbers.current {
  background: var(--erg-cta, #C8A84B);
  color: var(--erg-cta-contrast, #11151a);
  border-color: var(--erg-cta, #C8A84B);
  font-weight: 700;
}

/* Dots / ellipsis */
.elementor-pagination .page-numbers.dots {
  border: none;
  background: none;
  color: var(--erg-text-dim, #a9afb9);
  min-width: 28px;
  padding: 0;
  cursor: default;
}

/* Prev / Next text */
.elementor-pagination .page-numbers.prev,
.elementor-pagination .page-numbers.next {
  font-family: var(--erg-head, 'Oswald', sans-serif);
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: 12px;
  padding: 0 16px;
}

/* Disabled prev/next — Elementor uses <span> (not <a>) for disabled state */
.elementor-pagination .page-numbers.prev[aria-disabled="true"],
.elementor-pagination .page-numbers.next[aria-disabled="true"],
.elementor-pagination span.page-numbers.prev,
.elementor-pagination span.page-numbers.next {
  opacity: .35;
  pointer-events: none;
  cursor: default;
}

/* Load More button (if used) */
.e-load-more-anchor .e-load-more-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  border-radius: 12px;
  border: 1.5px solid rgba(200,168,75,.45);
  background: transparent;
  color: var(--erg-cta, #C8A84B);
  font-family: var(--erg-head, 'Oswald', sans-serif);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .2s ease;
}
.e-load-more-anchor .e-load-more-button:hover {
  background: var(--erg-cta, #C8A84B);
  color: var(--erg-cta-contrast, #11151a);
  border-color: var(--erg-cta, #C8A84B);
}

/* Mobile pagination: smaller */
@media (max-width: 767px) {
  .elementor-pagination .page-numbers,
  .e-pagination-previous-next a {
    min-width: 36px;
    height: 36px;
    padding: 0 8px;
    font-size: 12px;
    border-radius: 8px;
  }
  .elementor-pagination .page-numbers.prev,
  .elementor-pagination .page-numbers.next {
    padding: 0 12px;
    font-size: 11px;
  }
}
/* =========================================================
   BeRocket checkbox filters (Availability / In Steamboat Now)
   Added 2026-06-10 — the checkbox widget type had no ERG skin
   (only selects/select2 were styled), so labels inherited
   near-invisible colors and the block crowded the next heading.
========================================================= */

.erg-br-filters .bapf_ckbox ul{
  list-style: none !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
}

.erg-br-filters .bapf_ckbox li{
  margin: 0 0 8px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.erg-br-filters .bapf_ckbox input[type="checkbox"]{
  appearance: auto !important;
  -webkit-appearance: auto !important;
  accent-color: var(--erg-cta) !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 10px 0 0 !important;
  cursor: pointer !important;
  flex: 0 0 auto !important;
}

.erg-br-filters .bapf_ckbox li label{
  color: var(--erg-text) !important;
  font-family: var(--erg-body) !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  cursor: pointer !important;
  margin: 0 !important;
}

.erg-br-filters .bapf_ckbox li label:hover{
  color: var(--erg-cta-hover) !important;
}

.erg-br-filters .bapf_ckbox input[type="checkbox"]:checked + label{
  color: var(--erg-cta) !important;
  font-weight: 600 !important;
}

/* =========================================================
   CLEANER ARCHIVE CARDS (2026-06-18)
   Flatten the inner "bubble" boxes (title / price / meta / actions) so the
   category/archive loop cards match the flatter search cards. An injected rule
   (body.archive .e-loop-item .e-con) gives every inner container a panel
   bg + border + 12px radius + a faint shadow — neutralize ALL of it except the
   card panel, force the panel to the standard --erg-panel (#13181f, same as the
   search cards), and lay the actions out as a gold Add-to-Cart button + a
   More Info text link on one line. Image frame (.erg-card__thumb) is unaffected.
========================================================= */

/* Flatten inner sub-containers — clears the boxes AND the faint shadow seams */
body.archive .e-loop-item .e-con:not(.erg-plp-card){
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Card panel: uniform, matches the search card (no #181d23 vs #13181f drift) */
body.archive .e-loop-item .erg-plp-card{
  background:
    radial-gradient(120% 80% at 20% 0%, rgba(255,255,255,.035) 0, rgba(255,255,255,0) 60%),
    var(--erg-panel, #13181f) !important;
}

/* Actions: Add to Cart (button) + More Info (text link) on one line */
.erg-plp-card .erg-card__actions{
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  flex-wrap: nowrap !important;
}
.erg-plp-card .erg-card__actions .quantity{ display: none !important; } /* drop qty bubble */
.erg-plp-card .erg-card__actions .elementor-widget-woocommerce-product-add-to-cart{
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.erg-plp-card .erg-card__actions .erg-card__secondary-btn{
  flex: 0 0 auto !important;
  width: auto !important;
}

/* More Info → understated text link instead of a second gold pill */
.erg-plp-card .erg-card__actions .erg-card__secondary-btn .elementor-button{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: auto !important;
  min-height: 0 !important;
  padding: 4px 2px !important;

  font-family: var(--erg-head, "Oswald", sans-serif) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;

  color: var(--erg-link, #72B6C6) !important;
  border-bottom: 1px solid rgba(114,182,198,.4) !important;
}
@media (hover:hover){
  .erg-plp-card .erg-card__actions .erg-card__secondary-btn .elementor-button:hover{
    color: var(--erg-link-hover, #9BCED9) !important;
    border-bottom-color: rgba(155,206,217,.75) !important;
    transform: none !important;
  }
}

/* =========================================================
   ACCESSORY FILTER SET — flow inline like the sibling filters
   The accessory filters live in a wrapper (.erg-accessory-filters) that exists
   only so erg-archive-filters can toggle them as one unit. That flex wrapper
   was constraining the select2 dropdowns (107px vs 262px). display:contents
   removes the wrapper from layout on the accessories context, so its 4 filters
   render full-width and identical to the base/firearms filters. Scoped to the
   accessories context (on other contexts the wrapper is display:none'd by
   erg-archive-filters, which wins).
========================================================= */
body.erg-filters--accessories .erg-accessory-filters,
body.erg-filters--accessories .erg-accessory-filters .e-con-inner{
  display: contents !important;
}