.lfr-layout-structure-item-container {padding: 0;} .lfr-layout-structure-item-row {overflow: hidden;} .portlet-borderless .portlet-content {padding: 0;}.lfr-layout-structure-item-86dcda8d-7e3b-8c0f-d9ee-f8a88de7a488 {
display: none !important;
}
.lfr-layout-structure-item-dfc4ef26-09d7-937d-147f-7e5bcb993ab8 {
margin-bottom: 2rem !important;
}
.lfr-layout-structure-item-dc54312b-9e1e-8907-3cde-6d805a08a70d {
background-color: #CC8F8F00 !important;
margin-bottom: var(--spacer-5,3rem) !important;
margin-top: 3rem !important;
}
/*
 * BTI Pagination - Figma node 1514:17025
 * Pixel extraction summary (mapped to BTI tokens):
 * - Layout: horizontal, visually symmetric around active item.
 * - Main container gap ratio: 16:8 = 2:1 (outer vs inner spacing).
 * - Item ratio: text area 32 over item width 40 => 0.8.
 * - Icon frame: 24x24, active indicator: 8x8.
 */

.pagination-bar {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: var(--bti-spacing-4);
  justify-content: space-between;
  margin: var(--bti-spacing-8) 0 0;
  padding: 0;
}

.pagination-bar .pagination {
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: inline-flex;
  flex-wrap: nowrap;
  gap: var(--bti-spacing-2);
  margin: 0;
  padding: 0;
}

.pagination-bar .pagination .page-item {
  align-items: center;
  display: inline-flex;
  margin: 0;
  min-width: 0;
  padding: 0;
}

.pagination-bar .pagination .page-link {
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--bti-color-sand-80) !important;
  display: inline-flex;
  font-family: var(--bti-font-body);
  font-size: var(--bti-fs-body-m);
  font-style: normal;
  font-weight: var(--bti-fw-regular);
  height: auto;
  justify-content: center;
  letter-spacing: calc(var(--bti-fs-body-m) * 0.0125);
  line-height: var(--bti-lh-body-m);
  min-height: calc(var(--bti-spacing-4) + var(--bti-spacing-1));
  min-width: calc(var(--bti-spacing-8) + var(--bti-spacing-2));
  outline: 0;
  padding: var(--bti-spacing-2);
  text-decoration: none !important;
  transition:
    color 200ms ease,
    opacity 200ms ease,
    transform 200ms ease;
}

.pagination-bar .pagination .page-link::before,
.pagination-bar .pagination .page-link::after {
  display: none !important;
}

.pagination-bar .pagination .page-item .page-link:hover,
.pagination-bar .pagination .page-item .page-link:focus,
.pagination-bar .pagination .page-item .page-link:focus-visible {
  color: var(--bti-color-content-high) !important;
  opacity: 1;
  text-decoration: none !important;
  transform: translateY(calc(var(--bti-spacing-1) * -1));
}

.pagination-bar .pagination .page-item.active .page-link,
.pagination-bar .pagination .page-item[aria-current="page"] .page-link {
  color: var(--bti-color-content-high) !important;
  font-weight: var(--bti-fw-semibold);
  position: relative;
}

.pagination-bar .pagination .page-item.active .page-link::after,
.pagination-bar .pagination .page-item[aria-current="page"] .page-link::after {
  background: var(--bti-color-brand-purple);
  border-radius: var(--bti-radius-round);
  content: "";
  display: block !important;
  height: 0.25em;
  margin-top: var(--bti-spacing-2);
  position: absolute;
  top: calc(var(--bti-spacing-4) + var(--bti-spacing-2));
  width: 0.25em;
}

.pagination-bar .pagination .page-item.disabled .page-link,
.pagination-bar .pagination .page-item .page-link:disabled,
.pagination-bar .pagination .page-item .page-link[aria-disabled="true"] {
  color: var(--bti-color-content-disabled) !important;
  cursor: not-allowed;
  opacity: 1;
  pointer-events: none;
  transform: none;
}

.pagination-bar .pagination .page-item:first-child .page-link,
.pagination-bar .pagination .page-item:last-child .page-link {
  min-height: calc(var(--bti-spacing-4) + var(--bti-spacing-2));
  min-width: calc(var(--bti-spacing-4) + var(--bti-spacing-2));
  padding: 0;
}

.pagination-bar .pagination .page-item:first-child .page-link .lexicon-icon,
.pagination-bar .pagination .page-item:last-child .page-link .lexicon-icon {
  background-color: none;
  border-radius: var(--bti-radius-round);
  color: var(--bti-color-brand-purple);
  display: inline-block;
  height: calc(var(--bti-spacing-4) + var(--bti-spacing-2));
  padding: var(--bti-spacing-2);
  width: calc(var(--bti-spacing-4) + var(--bti-spacing-2));
}

.pagination-bar
  .pagination
  .page-item:first-child
  .page-link
  .lexicon-icon
  path,
.pagination-bar
  .pagination
  .page-item:last-child
  .page-link
  .lexicon-icon
  path {
  fill: var(--bti-color-brand-purple);
}

.pagination-bar .pagination-results {
  color: var(--bti-color-content-medium);
  font-family: var(--bti-font-body);
  font-size: var(--bti-fs-body-s);
  font-weight: var(--bti-fw-regular);
  line-height: var(--bti-lh-body-s);
}

.pagination-bar .pagination-items-per-page,
.pagination-bar .pagination-items-per-page .dropdown-toggle,
.pagination-bar .pagination-items-per-page .dropdown-menu,
.pagination-bar .pagination-items-per-page .dropdown-item {
  font-family: var(--bti-font-body);
}

.pagination-bar .pagination-items-per-page .dropdown-toggle {
  align-items: center;
  background: var(--bti-color-brand-light);
  border: var(--bti-border-width) var(--bti-border-style)
    var(--bti-color-pink-60);
  border-radius: var(--bti-radius-round);
  color: var(--bti-color-content-high);
  display: inline-flex;
  font-size: var(--bti-fs-body-s);
  font-weight: var(--bti-fw-regular);
  gap: var(--bti-spacing-2);
  justify-content: space-between;
  line-height: var(--bti-lh-body-s);
  min-height: calc(var(--bti-spacing-6) + var(--bti-spacing-1));
  padding: var(--bti-spacing-2) var(--bti-spacing-3);
  transition:
    background-color 200ms ease,
    border-color 200ms ease,
    color 200ms ease;
}

.pagination-bar .pagination-items-per-page .dropdown-toggle:hover,
.pagination-bar .pagination-items-per-page .dropdown-toggle:focus,
.pagination-bar .pagination-items-per-page .dropdown-toggle:focus-visible {
  background: var(--bti-color-pink-20);
  border-color: var(--bti-color-brand-pink);
  color: var(--bti-color-brand-pink);
  outline: 0;
}

.pagination-bar
  .pagination-items-per-page
  .dropdown-toggle[aria-expanded="true"] {
  background: var(--bti-color-brand-purple);
  border-color: var(--bti-color-brand-purple);
  color: var(--bti-color-content-inverse);
}

.pagination-bar .pagination-items-per-page.disabled .dropdown-toggle,
.pagination-bar .pagination-items-per-page .dropdown-toggle:disabled,
.pagination-bar
  .pagination-items-per-page
  .dropdown-toggle[aria-disabled="true"] {
  background: var(--bti-color-sand-20);
  border-color: var(--bti-color-sand-50);
  color: var(--bti-color-content-disabled);
  cursor: not-allowed;
}

.pagination-bar .pagination-items-per-page .dropdown-menu {
  background: var(--bti-color-brand-light);
  border: var(--bti-border-width) var(--bti-border-style)
    var(--bti-color-sand-50);
  border-radius: var(--bti-radius-s);
}

.pagination-bar .pagination-items-per-page .dropdown-item {
  color: var(--bti-color-content-medium);
  font-size: var(--bti-fs-body-s);
  font-weight: var(--bti-fw-regular);
  line-height: var(--bti-lh-body-s);
}

.pagination-bar .pagination-items-per-page .dropdown-item:hover,
.pagination-bar .pagination-items-per-page .dropdown-item:focus,
.pagination-bar .pagination-items-per-page .dropdown-item:focus-visible {
  background: var(--bti-color-pink-20);
  color: var(--bti-color-brand-pink);
  outline: 0;
}

@media (max-width: 767px) {
  .pagination-bar {
    align-items: flex-start;
    gap: var(--bti-spacing-3);
    margin-top: var(--bti-spacing-6);
  }

  .pagination-bar .pagination {
    gap: var(--bti-spacing-1);
  }

  .pagination-bar .pagination .page-link {
    font-size: var(--bti-fs-body-s);
    line-height: var(--bti-lh-body-s);
    min-width: calc(var(--bti-spacing-7) + var(--bti-spacing-1));
  }

  .pagination-bar .pagination .page-item.active .page-link::after,
  .pagination-bar
    .pagination
    .page-item[aria-current="page"]
    .page-link::after {
    top: calc(var(--bti-spacing-4) + var(--bti-spacing-1));
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .pagination-bar {
    align-items: center;
    gap: var(--bti-spacing-4);
  }

  .pagination-bar .pagination {
    gap: var(--bti-spacing-2);
  }
}

@media (min-width: 1024px) {
  .pagination-bar {
    align-items: flex-start;
    gap: var(--bti-spacing-4);
  }

  .pagination-bar .pagination {
    gap: var(--bti-spacing-2);
  }
}

@media (prefers-reduced-motion: reduce) {
  .pagination-bar .pagination .page-link,
  .pagination-bar .pagination-items-per-page .dropdown-toggle,
  .pagination-bar .pagination-items-per-page .dropdown-item {
    transform: none;
    transition: none;
  }

  .pagination-bar .pagination .page-item .page-link:hover,
  .pagination-bar .pagination .page-item .page-link:focus,
  .pagination-bar .pagination .page-item .page-link:focus-visible {
    transform: none;
  }
}
.lfr-layout-structure-item-fa96dbe0-c95d-6fe2-d449-38701448462c {
margin-bottom: var(--spacer-2,0.5rem) !important;
}
button#commerce-order-by {
    border-radius: 0;
    padding: var(--bti-spacing-2) var(--bti-spacing-3);
}
.portlet-boundary_com_liferay_commerce_product_content_search_web_internal_portlet_CPSortPortlet_ .d-flex.ml-auto.pull-right {
  align-items: center;
  position: relative;
}

.portlet-boundary_com_liferay_commerce_product_content_search_web_internal_portlet_CPSortPortlet_ .dropdown-toggle {
  align-items: center;
  display: inline-flex;
  gap: var(--bti-spacing-2);
  position: relative;
  pointer-events: auto;
  z-index: 2;
}

.portlet-boundary_com_liferay_commerce_product_content_search_web_internal_portlet_CPSortPortlet_ .dropdown-toggle * {
  pointer-events: none;
}

.portlet-boundary_com_liferay_commerce_product_content_search_web_internal_portlet_CPSortPortlet_ .dropdown-menu {
  z-index: 1050;
}.lfr-layout-structure-item-4609bc08-b69f-8381-49f9-1586ad954c32 h2 {
font-size: var(--bti-fs-headline-m);
line-height: var(--bti-lh-headline-m);
font-family: var(--bti-font-headline);
}.lfr-layout-structure-item-d0762eaf-a286-6433-bfae-8044f4c9f1c0 {
margin-top: var(--spacer-4,1.5rem) !important;
}
.lfr-layout-structure-item-2432896c-596a-8ed1-764a-96ec73b0c4aa {
display: none !important;
}
