.swiper-pagination-bullet-active,
.header-menu .close-menu,
.header-menu .back-button,
.admin-header-links,
.block .title,
.block .list li:hover a:before,
.footer-block li:hover a:before,
.filters .ui-slider-range,
.item-box button,
.pager li span,
.overview .subscribe-button,
.free-shipping,
.overview .add-to-cart-button,
.variant-overview .add-to-cart-button,
.mfp-container .apply-shipping-button,
.write-review .button-1,
.wishlist-add-to-cart-button,
.contact-page .button-1,
.email-a-friend-page .button-1,
.apply-vendor-page .button-1,
.registration-page .button-2,
.registration-result-page .button-1,
.login-page .button-1,
.password-recovery-page .button-1,
.account-page .button-1,
.return-request-page .button-1,
.shopping-cart-page .button-1,
.checkout-page .button-1,
.shopping-cart-page .button-2,
.checkout-page .button-2,
.order-details-page .page-title a,
.search-input .button-1,
.new-comment .button-1,
.topic-post .quote-post a,
.blog-search-results li a:before,
.mini-shopping-cart button,
.header-menu .sublist li > a:hover,
.nivo-controlNav .nivo-control,
.anywhere-slider .slick-dots button,
.ajax-cart-button-wrapper input[type="text"],
.ajax-cart-button-wrapper select,
.ajaxCart .productAddedToCartWindowCheckout,
.ui-slider-range,
.nopAjaxFilters7Spikes .close-filters,
.home-page-filter-button .results-number,
.home-page-filter-button .search-button,
.home-page-filter-button .search-button:after,
.categories.fullWidth .row:before,
.manufacturers.fullWidth .row:before,
.mega-menu .title,
.ui-datepicker-calendar td a:hover,
.user-agreement-page .button-1,
.rich-blog-homepage .read-more,
.ropc .estimate-shipping-panel button,
.ropc .current-code button,
.ropc .cart-total button,
.ropc .complete-button button,
.slick-dots button,
.forum-edit-page .buttons button[type="submit"],
.move-topic-page .buttons button[type="submit"],
.private-messages-page .buttons button[type="submit"],
.private-message-send-page .options button[type="submit"],
.private-message-view-page .options button.button-1 {
  background-color: #c03;
}
.page-title h1,
.inbox-qty,
.wishlist-qty,
.cart-qty,
.breadcrumb strong,
.tax-shipping-info a,
.product-name h1,
.variant-overview .variant-name,
.product-review-item .review-title,
.wishlist-page .share-info a,
.return-request-list-page .comments,
.reward-points-history .title,
.order-progress li.current-step a,
.cart-collaterals .title,
.checkout-page .address-item li.country,
.order-review-data .title,
.shipment-overview .title,
.order-details-area .title,
.post-title,
.news-title,
.comment-info .username,
.forums-main-page .topic-block h2,
.forums-table-section-title .view-all,
.forum-page .forum-name h1,
.forum-topic-page .topic-name,
.profile-page .topic-title,
.forum-edit-page strong,
.private-message-send-page a,
.header-links a:hover,
.mini-shopping-cart .count a,
.mini-shopping-cart .totals strong,
.footer-block li:hover a,
.footer-block.recently-viewed a:hover,
.news-list-homepage .news-title:hover,
.block .list a:hover,
.block .tags li a:hover,
.product-tags-all-page li a:hover,
.product-item .product-title a:hover,
.overview .email-a-friend-button:hover,
.product-tags-list a:hover,
.product-review-item .review-info a:hover,
.product-review-helpfulness .vote:hover,
.login-page .forgot-password a:hover,
.cart .product-name:hover,
.opc .back-link a:hover,
.sitemap-page a:hover,
.blog-page .tags a:hover,
.blogpost-page .tags a:hover,
.forums-table-section a:hover,
.forums-table-section td a:hover,
.forum-breadcrumb a:hover,
.forum-page .actions a:hover,
.forum-topic-page .actions a:hover,
.topic-footer .actions a:hover,
td.details a,
.productAddedToCartWindowDescription strong,
.filtersGroupPanel li .filter-item-name:hover,
.filtersGroupPanel li.checked .filter-item-name,
.mega-menu .box li a:hover,
.product-specs-box a,
.cart .edit-item a:hover,
.order-details-page .download a,
.order-details-page .download-license a,
.rich-blog-homepage .view-all a:hover,
.blog-search-results li a:hover,
.post-footer a,
.rich-blog-autocomplete-last-item span,
.blog-search-results li a,
.search-term-highlighter {
  color: #c03;
}
.block .list li:hover a:before,
.footer-block li:hover a:before,
.pager li span,
.registration-page .buttons,
.registration-result-page .buttons,
.login-page .buttons,
.password-recovery-page .buttons,
.account-page .buttons,
.return-request-page .buttons,
.address-list-page .add-button,
.order-progress li.current-step a:before,
.mini-shopping-cart .count,
.blog-search-results li a:before {
  border-color: #c03;
}

/* ---- Wishlist heart icon overlay on product card ---- */
.product-item .picture {
  position: relative;
}
.product-item .product-wish-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 5;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,0.18);
  color: #bbb;
  padding: 0;
  opacity: 0;
  transition: opacity 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.product-item:hover .product-wish-btn,
.product-item .product-wish-btn.wishlisted {
  opacity: 1;
}
.product-item .product-wish-btn:hover {
  background: #2c5aa0;
  color: #fff;
}
.product-item .product-wish-btn.wishlisted {
  background: #c03;
  color: #fff;
}
.product-item .product-wish-btn svg {
  width: 18px;
  height: 18px;
  pointer-events: none;
}
.product-item .product-wish-btn:hover svg,
.product-item .product-wish-btn.wishlisted svg {
  fill: #fff;
  stroke: #fff;
}

/* ---- Wishlist heart button on product detail page ---- */
.add-to-cart-wish-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.add-to-cart-wish-wrapper .add-to-cart {
  flex: 1;
}
.product-details-wish-btn {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #e0e0e0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
  color: #bbb;
  padding: 0;
  flex-shrink: 0;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.product-details-wish-btn:hover,
.product-details-wish-btn.wishlisted {
  background: #c03;
  border-color: #c03;
  color: #fff;
}
.product-details-wish-btn svg {
  width: 22px;
  height: 22px;
  pointer-events: none;
}
.product-details-wish-btn:hover svg,
.product-details-wish-btn.wishlisted svg {
  fill: #fff;
  stroke: #fff;
}

/* ---- Filters title panel with Clear button ---- */
.filtersTitlePanel {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px 10px;
  border-bottom: 1px solid #e8e8e8;
  margin-bottom: 4px;
}

/* ---- Spacing & separation between left filter blocks ---- */
@media all and (min-width: 1025px) {
  .filtersPanel .filter-block {
    margin-top: 24px !important;
    padding-top: 20px;
    border-top: 2px solid #e8e8e8;
  }
  .filtersPanel .filter-block:first-of-type {
    margin-top: 0 !important;
    padding-top: 0;
    border-top: none;
  }

  /* ---- Make filter block titles visibly clickable (for fold/unfold) ---- */
  .filter-block .title a.toggleControl {
    cursor: pointer;
  }

  /* ---- Category/Manufacturer navigation block: title is clickable to fold/unfold ---- */
  .block-category-navigation .title,
  .block-manufacturer-navigation .title {
    cursor: pointer;
  }
}

/* ---- Side-2 column background matches site background ---- */
.side-2 {
  background-color: #F9F9FC !important;
}

/* ---- Left filter section cards: spacing + border ---- */
.block-category-navigation,
.block-manufacturer-navigation,
.product-manufacturer-filter,
.product-spec-filter,
.block-vendor-navigation,
.product-usage-type-filter {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-bottom: 16px !important;
  border: 1.5px solid #2c5aa0 !important;
  border-radius: 8px !important;
  overflow: visible !important;
}

/* Round only the top corners of each block's title (since overflow:visible can't clip them) */
.block-category-navigation .title,
.block-manufacturer-navigation .title,
.product-manufacturer-filter .title,
.product-spec-filter .title,
.block-vendor-navigation .title,
.product-usage-type-filter .title {
  border-radius: 6px 6px 0 0 !important;
}

/* Round the bottom corners of the last visible child in each block */
.block-category-navigation .listbox,
.block-manufacturer-navigation .listbox,
.block-vendor-navigation .listbox,
.product-usage-type-filter .usage-type-content {
  border-radius: 0 0 6px 6px !important;
  overflow: hidden !important;
}
.product-manufacturer-filter .filter-content,
.product-spec-filter .filter-content {
  border-radius: 0 0 6px 6px !important;
  overflow: hidden !important;
}

.filtersTitle {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #333;
}
.clearFilterOptionsAll {
  float: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: #c03;
  background: transparent;
  border: 1px solid #c03;
  border-radius: 4px;
  padding: 3px 10px;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.18s ease, color 0.18s ease;
  line-height: 1.5;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, background 0.18s ease, color 0.18s ease;
}
.clearFilterOptionsAll.filters-active {
  opacity: 1;
  pointer-events: auto;
}
.clearFilterOptionsAll:hover {
  background: #c03;
  color: #fff;
}

/* ============================================================
   Modern minimal checkboxes — Sub-categories, Manufacturers, Models
   ============================================================ */

/* List / group reset */
.product-usage-type-filter .group,
.product-manufacturer-filter .group,
.product-spec-filter .group {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Row — override any theme flex/block interference */
.product-usage-type-filter .item,
.product-manufacturer-filter .item,
.product-spec-filter .item {
  display: block;  /* label becomes full-width naturally — NO !important so JS can override with display:none */
  padding: 0 !important;
  margin: 0 !important;
}

/* Fully hide native checkbox — display:none keeps :checked sibling selector working */
.product-usage-type-filter .item input[type="checkbox"],
.product-manufacturer-filter .item input[type="checkbox"],
.product-spec-filter .item input[type="checkbox"] {
  display: none !important;
}

/* Label — full-width clickable row */
.product-usage-type-filter .item label,
.product-manufacturer-filter .item label,
.product-spec-filter .item label {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 8px 14px !important;
  margin: 0 !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  color: #333 !important;
  cursor: pointer !important;
  border-bottom: 1px solid #f0f0f0 !important;
  background: transparent !important;
  transition: background 0.15s ease, color 0.15s ease !important;
  user-select: none !important;
}

.product-usage-type-filter .item:last-child label,
.product-manufacturer-filter .item:last-child label,
.product-spec-filter .item:last-child label {
  border-bottom: none !important;
}

/* Remove the dotted bottom border Traction puts on the last <li class="item"> itself */
.product-usage-type-filter .item:last-child,
.product-manufacturer-filter .item:last-child,
.product-spec-filter .item:last-child {
  border-bottom: none !important;
}

/* Remove bottom border/line on last item in category, vendor, manufacturer nav lists */
.block-category-navigation .list li:last-child,
.block-vendor-navigation .list li:last-child,
.block-manufacturer-navigation .list li:last-child {
  border-bottom: none !important;
}

/* Remove excess bottom padding from content containers so no blank gap shows */
.block-category-navigation .listbox,
.block-vendor-navigation .listbox,
.block-manufacturer-navigation .listbox,
.product-usage-type-filter .listbox,
.product-usage-type-filter .usage-type-content,
.product-manufacturer-filter .filter-content,
.product-spec-filter .filter-content {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.product-usage-type-filter .item label:hover,
.product-manufacturer-filter .item label:hover,
.product-spec-filter .item label:hover {
  background: #f4f7fc !important;
  color: #2c5aa0 !important;
}

/* Custom checkbox box — ::before (16×16 rounded square) */
.product-usage-type-filter .item label::before,
.product-manufacturer-filter .item label::before,
.product-spec-filter .item label::before {
  content: "" !important;
  /* Override Traction's .filters label:before { position: absolute } */
  position: relative !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
  align-self: center !important;
  top: auto !important;
  left: auto !important;
  margin: 0 !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  border: 1.5px solid #bcc5d6 !important;
  border-radius: 4px !important;
  background: #fff !important;
  transition: border-color 0.15s ease, background 0.15s ease !important;
  box-sizing: border-box !important;
}

/* Custom checkmark — ::after (L-shape tick, absolute inside label) */
/* label padding-left = 14px, box width = 16px → box centre-x ≈ 22px → tick left edge ≈ 18px */
.product-usage-type-filter .item label::after,
.product-manufacturer-filter .item label::after,
.product-spec-filter .item label::after {
  content: "" !important;
  position: absolute !important;
  left: 18px !important;
  top: 50% !important;
  width: 9px !important;
  height: 5px !important;
  border-left: 2px solid #fff !important;
  border-bottom: 2px solid #fff !important;
  transform: translateY(-65%) rotate(-45deg) !important;
  opacity: 0 !important;
  transition: opacity 0.15s ease !important;
}

/* Checked state — label */
.product-usage-type-filter .item input[type="checkbox"]:checked + label,
.product-manufacturer-filter .item input[type="checkbox"]:checked + label,
.product-spec-filter .item input[type="checkbox"]:checked + label {
  color: #2c5aa0 !important;
  font-weight: 600 !important;
  background: #f0f5ff !important;
}

/* Checked state — box fill */
.product-usage-type-filter .item input[type="checkbox"]:checked + label::before,
.product-manufacturer-filter .item input[type="checkbox"]:checked + label::before,
.product-spec-filter .item input[type="checkbox"]:checked + label::before {
  background: #2c5aa0 !important;
  border-color: #2c5aa0 !important;
}

/* Checked state — show tick */
.product-usage-type-filter .item input[type="checkbox"]:checked + label::after,
.product-manufacturer-filter .item input[type="checkbox"]:checked + label::after,
.product-spec-filter .item input[type="checkbox"]:checked + label::after {
  opacity: 1 !important;
}

/* Listbox / filter-content padding */
.product-manufacturer-filter .filter-content,
.product-spec-filter .filter-content {
  padding: 6px 0 4px !important;
}

/* "Model" group name header — keep hidden (server renders it but it's not needed) */
.product-spec-filter .group .name {
  display: none !important;
}

/* ============================================================
   Filter section search boxes — tight flush design
   ============================================================ */

/* Wrapper: zero padding, flush edge-to-edge strip below the title */
.filter-search-wrap {
  padding: 0 !important;
  margin: 0 !important;
  border-bottom: 1.5px solid #dce6f5 !important;
  background: #f0f4fb !important;
}

/* The input itself — flush, no radius, no own border, fills the strip */
/*
  Specificity battle:
    Traction (or AjaxFilters):  .filters input          → 0,1,1
    This rule:  .filters .filter-search-box             → 0,2,0  ← wins even with !important on both sides
  We also include standalone .filter-search-box for containers without .filters (Categories, Vendors).
*/
.filters .filter-search-box,
.filter-content .filter-search-box,
.filter-search-box {
  display: block !important;
  /* Override Traction's / AjaxFilters' .filters input { position: absolute; opacity: 0 } */
  position: relative !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 1 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 9px 14px 9px 36px !important;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  color: #333 !important;
  background: #f0f4fb url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23a0aec0' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat 12px center !important;
  border: none !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  min-height: 0 !important;
  height: auto !important;
  transition: background-color 0.15s ease !important;
}

.filters .filter-search-box:focus,
.filter-content .filter-search-box:focus,
.filter-search-box:focus {
  background-color: #e6edf8 !important;
  outline: none !important;
}

/* ============================================================
   Mobile — strip card styling so it doesn't break Traction's
   fixed dark-drawer AjaxFilters panel (≤ 1024px)
   ============================================================ */
@media (max-width: 1024px) {

  /* Remove card frames from all filter sections */
  .block-category-navigation,
  .block-manufacturer-navigation,
  .product-manufacturer-filter,
  .product-spec-filter,
  .block-vendor-navigation,
  .product-usage-type-filter {
    margin-bottom: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  /* Reset title and content corner radii on mobile */
  .block-category-navigation .title,
  .block-manufacturer-navigation .title,
  .product-manufacturer-filter .title,
  .product-spec-filter .title,
  .block-vendor-navigation .title,
  .product-usage-type-filter .title,
  .block-category-navigation .listbox,
  .block-manufacturer-navigation .listbox,
  .block-vendor-navigation .listbox,
  .product-usage-type-filter .usage-type-content,
  .product-manufacturer-filter .filter-content,
  .product-spec-filter .filter-content {
    border-radius: 0 !important;
    overflow: visible !important;
  }

  /* Remove side-2 custom background — let Traction/browser handle it */
  .side-2 {
    background-color: transparent !important;
  }

  /* Search box — adapt for dark drawer (AjaxFilters sections) and light stacked column (nav blocks) */
  .filter-search-wrap {
    border-bottom: 1px solid rgba(255,255,255,0.15) !important;
    background: rgba(255,255,255,0.1) !important;
  }

  .filters .filter-search-box,
  .filter-content .filter-search-box,
  .filter-search-box {
    background-color: transparent !important;
    background-image: none !important; /* hide SVG search icon — too small on mobile */
    padding: 9px 14px !important;
    color: #fff !important;
    position: relative !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .filters .filter-search-box::placeholder,
  .filter-content .filter-search-box::placeholder,
  .filter-search-box::placeholder {
    color: rgba(255,255,255,0.5) !important;
  }

  /* Nav blocks (Categories, Manufacturers nav, Vendors) sit in .side-2 on mobile —
     those are light background so restore legible colours */
  .block-category-navigation .filter-search-box,
  .block-manufacturer-navigation .filter-search-box,
  .block-vendor-navigation .filter-search-box {
    color: #333 !important;
    background-color: #f0f4fb !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23a0aec0' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat 12px center !important;
    padding: 9px 14px 9px 36px !important;
  }

  .block-category-navigation .filter-search-box::placeholder,
  .block-manufacturer-navigation .filter-search-box::placeholder,
  .block-vendor-navigation .filter-search-box::placeholder {
    color: #a0aec0 !important;
  }

  .block-category-navigation .filter-search-wrap,
  .block-manufacturer-navigation .filter-search-wrap,
  .block-vendor-navigation .filter-search-wrap {
    background: #f0f4fb !important;
    border-bottom: 1.5px solid #dce6f5 !important;
  }
}