:root {
  --blur-radius: 15px;
  --box-shadow-1: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  --border-radius: 15px;
  --link-transition: all 0.3s ease-in-out;
  --global-transition: all 0.6s ease-in-out;
  --slow-transition: all 0.9s ease-in-out;
  --c-black: #111111;
  --c-off-black: #333333;
  --c-off-white: #F3F3F3;
  --c-panels: rgb(244 244 244 / 70%);
  --c-alt-white: #cecece;
  --c-purple: #42276c;
  --c-dark-purple: #050E27;
  --c-teal: #0bb09f;
  --c-teal-dark: #045E54;
  --c-white: #ffffff;
  --c-red: #f61646;
  --c-red-dark: #b00b31;
  --universal-space: 1.5rem;
  --universal-space-2: calc(var(--universal-space) * 2);
  --universal-space-3: calc(var(--universal-space) * 3);
  --universal-space-4: calc(var(--universal-space) * 4);
  --universal-space-5: calc(var(--universal-space) * 5);
  --universal-space-6: calc(var(--universal-space) * 6);
  --universal-space-7: calc(var(--universal-space) * 7);
  --universal-space-8: calc(var(--universal-space) * 8);
  --universal-space-9: calc(var(--universal-space) * 9);
  --universal-space-half: calc(var(--universal-space) / 2);
}

input:not(.search-input-with-button):not(.number-input__input), select, .slds-combobox__input {
  border: 1px solid var(--c-off-black) !important;
  background: var(--c-white) !important;
  height: 60px !important;
}
input:not(.search-input-with-button):not(.number-input__input):hover, select:hover, .slds-combobox__input:hover {
  border-color: var(--c-purple) !important;
  background: #f7f7f7 !important;
  cursor: pointer;
}

.slds-form-element {
  margin: 0 !important;
}

label {
  display: block;
  margin: var(--universal-space-half) 0 5px 0 !important;
}

label.slds-checkbox__label {
  margin: 0 !important;
}

.slds-form-element__legend {
  font-weight: normal !important;
  font-size: 24px !important;
  margin: var(--universal-space) 0 0 0 !important;
}

.lwc-59rp2cdcr2p.slds-p-bottom_large.address-type {
  display: flex;
}
.lwc-59rp2cdcr2p.slds-p-bottom_large.address-type > span {
  display: flex;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 500 !important;
}

body {
  background-image: url("https://resources.tristel.com/dist/images/background_new_new.png");
  background-position: bottom 30% center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100dvh;
}

button {
  border: none !important;
  text-decoration: none !important;
}

.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button) {
  appearance: none;
  margin: 0;
  outline: none;
  box-shadow: none;
  border: none;
  border-radius: 0;
  background: none;
  padding: 0;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):focus, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):active {
  outline: none;
  border: none;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):before, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):after {
  display: none !important;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button) {
  display: inline-flex !important;
  justify-content: center;
  align-items: center;
  appearance: none;
  outline: 0;
  box-shadow: var(--box-shadow-1);
  border: none;
  border-radius: var(--border-radius);
  padding: var(--universal-space-half) var(--universal-space-2);
  height: 45px;
  width: auto;
  text-align: center;
  text-decoration: none !important;
  color: var(--c-white);
  font-weight: 500;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):hover, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):active, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):focus {
  cursor: pointer;
  opacity: 1;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button) {
  appearance: none;
  margin: 0;
  outline: none;
  box-shadow: none;
  border: none;
  border-radius: 0;
  background: none;
  padding: 0;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):focus, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):active {
  outline: none;
  border: none;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):before, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):after {
  display: none !important;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button) {
  display: inline-flex !important;
  justify-content: center;
  align-items: center;
  appearance: none;
  outline: 0;
  box-shadow: var(--box-shadow-1);
  border: none;
  border-radius: var(--border-radius);
  padding: var(--universal-space-half) var(--universal-space-2);
  height: 45px;
  width: auto;
  text-align: center;
  text-decoration: none !important;
  color: var(--c-white);
  font-weight: 500;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):hover, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):active, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):focus {
  cursor: pointer;
  opacity: 1;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button) {
  background: none !important;
  border: 1px solid var(--c-purple) !important;
  color: var(--c-purple) !important;
}
.slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):hover, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):active, .slds-button.slds-button_neutral:not(.number-input__decrement-button):not(.number-input__increment-button):focus {
  background: var(--c-alt-white) !important;
  border: 1px solid var(--c-purple) !important;
}
.slds-button.slds-button_outline-brand {
  appearance: none;
  margin: 0;
  outline: none;
  box-shadow: none;
  border: none;
  border-radius: 0;
  background: none;
  padding: 0;
}
.slds-button.slds-button_outline-brand:focus, .slds-button.slds-button_outline-brand:active {
  outline: none;
  border: none;
}
.slds-button.slds-button_outline-brand:before, .slds-button.slds-button_outline-brand:after {
  display: none !important;
}
.slds-button.slds-button_outline-brand {
  display: inline-flex !important;
  justify-content: center;
  align-items: center;
  appearance: none;
  outline: 0;
  box-shadow: var(--box-shadow-1);
  border: none;
  border-radius: var(--border-radius);
  padding: var(--universal-space-half) var(--universal-space-2);
  height: 45px;
  width: auto;
  text-align: center;
  text-decoration: none !important;
  color: var(--c-white);
  font-weight: 500;
}
.slds-button.slds-button_outline-brand:hover, .slds-button.slds-button_outline-brand:active, .slds-button.slds-button_outline-brand:focus {
  cursor: pointer;
  opacity: 1;
}
.slds-button.slds-button_outline-brand:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.slds-button.slds-button_outline-brand {
  appearance: none;
  margin: 0;
  outline: none;
  box-shadow: none;
  border: none;
  border-radius: 0;
  background: none;
  padding: 0;
}
.slds-button.slds-button_outline-brand:focus, .slds-button.slds-button_outline-brand:active {
  outline: none;
  border: none;
}
.slds-button.slds-button_outline-brand:before, .slds-button.slds-button_outline-brand:after {
  display: none !important;
}
.slds-button.slds-button_outline-brand {
  display: inline-flex !important;
  justify-content: center;
  align-items: center;
  appearance: none;
  outline: 0;
  box-shadow: var(--box-shadow-1);
  border: none;
  border-radius: var(--border-radius);
  padding: var(--universal-space-half) var(--universal-space-2);
  height: 45px;
  width: auto;
  text-align: center;
  text-decoration: none !important;
  color: var(--c-white);
  font-weight: 500;
}
.slds-button.slds-button_outline-brand:hover, .slds-button.slds-button_outline-brand:active, .slds-button.slds-button_outline-brand:focus {
  cursor: pointer;
  opacity: 1;
}
.slds-button.slds-button_outline-brand:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.slds-button.slds-button_outline-brand {
  background: none !important;
  border: 1px solid var(--c-purple) !important;
  color: var(--c-purple) !important;
}
.slds-button.slds-button_outline-brand:hover, .slds-button.slds-button_outline-brand:active, .slds-button.slds-button_outline-brand:focus {
  background: var(--c-alt-white) !important;
  border: 1px solid var(--c-purple) !important;
}
.slds-button.slds-button_brand {
  appearance: none;
  margin: 0;
  outline: none;
  box-shadow: none;
  border: none;
  border-radius: 0;
  background: none;
  padding: 0;
}
.slds-button.slds-button_brand:focus, .slds-button.slds-button_brand:active {
  outline: none;
  border: none;
}
.slds-button.slds-button_brand:before, .slds-button.slds-button_brand:after {
  display: none !important;
}
.slds-button.slds-button_brand {
  display: inline-flex !important;
  justify-content: center;
  align-items: center;
  appearance: none;
  outline: 0;
  box-shadow: var(--box-shadow-1);
  border: none;
  border-radius: var(--border-radius);
  padding: var(--universal-space-half) var(--universal-space-2);
  height: 45px;
  width: auto;
  text-align: center;
  text-decoration: none !important;
  color: var(--c-white);
  font-weight: 500;
}
.slds-button.slds-button_brand:hover, .slds-button.slds-button_brand:active, .slds-button.slds-button_brand:focus {
  cursor: pointer;
  opacity: 1;
}
.slds-button.slds-button_brand:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.slds-button.slds-button_brand {
  appearance: none;
  margin: 0;
  outline: none;
  box-shadow: none;
  border: none;
  border-radius: 0;
  background: none;
  padding: 0;
}
.slds-button.slds-button_brand:focus, .slds-button.slds-button_brand:active {
  outline: none;
  border: none;
}
.slds-button.slds-button_brand:before, .slds-button.slds-button_brand:after {
  display: none !important;
}
.slds-button.slds-button_brand {
  display: inline-flex !important;
  justify-content: center;
  align-items: center;
  appearance: none;
  outline: 0;
  box-shadow: var(--box-shadow-1);
  border: none;
  border-radius: var(--border-radius);
  padding: var(--universal-space-half) var(--universal-space-2);
  height: 45px;
  width: auto;
  text-align: center;
  text-decoration: none !important;
  color: var(--c-white);
  font-weight: 500;
}
.slds-button.slds-button_brand:hover, .slds-button.slds-button_brand:active, .slds-button.slds-button_brand:focus {
  cursor: pointer;
  opacity: 1;
}
.slds-button.slds-button_brand:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.slds-button.slds-button_brand {
  background: linear-gradient(180deg, var(--c-dark-purple), var(--c-purple)) !important;
  color: var(--c-white) !important;
}
.slds-button.slds-button_brand:hover, .slds-button.slds-button_brand:active, .slds-button.slds-button_brand:focus {
  background: var(--c-purple) !important;
}

footer {
  background: linear-gradient(180deg, #42276c, #050e27);
}

.header.lwc-5g35a4nm657 {
  border: none !important;
}

header.lwc-76t23tn52sc {
  background: none !important;
}
header.lwc-76t23tn52sc > div {
  border: 1px solid var(--c-alt-white) !important;
  border-radius: var(--border-radius) !important;
  background: var(--c-panels) !important;
  box-shadow: var(--box-shadow-1);
}
header.lwc-76t23tn52sc .header-content {
  padding: var(--universal-space) 0 !important;
}
header.lwc-76t23tn52sc .input-wrapper {
  border: 1px solid var(--c-purple) !important;
}

.header-badge-icons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--universal-space-half);
}

.header-icon .icon-container {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  box-shadow: var(--box-shadow-1);
  border-radius: 100%;
  background-color: var(--c-white) !important;
  width: var(--universal-space-2);
  height: var(--universal-space-2);
  padding: var(--universal-space) !important;
  transition: var(--link-transition);
}
.header-icon .icon-container svg,
.header-icon .icon-container img {
  position: absolute;
  width: 24px;
  height: 24px;
  fill: var(--c-teal);
}
.header-icon .icon-container:hover {
  background: var(--c-teal) !important;
}
.header-icon .icon-container:hover svg {
  fill: var(--c-white) !important;
}
.header-icon .lwc-772joti571h-host {
  padding: 0 !important;
}

.panel-element .slds-panel {
  background-color: var(--c-panels);
}
.panel-element .slds-panel__header-title {
  font-size: 21px;
}
.panel-element .slds-button_icon {
  position: relative;
  box-shadow: var(--box-shadow-1);
  border-radius: 100%;
  background-color: var(--c-white) !important;
  width: var(--universal-space-2);
  height: var(--universal-space-2);
  padding: var(--universal-space) !important;
  transition: var(--link-transition);
}
.panel-element .slds-button_icon svg,
.panel-element .slds-button_icon img {
  position: absolute;
  width: 24px;
  height: 24px;
  fill: var(--c-teal);
}
.panel-element .slds-button_icon:hover {
  background: var(--c-teal) !important;
}
.panel-element .slds-button_icon:hover svg {
  fill: var(--c-white) !important;
}
.panel-element .panel-content {
  padding: var(--universal-space) !important;
}
.panel-element .panel_footer {
  background-color: var(--c-panels);
}
.panel-element .panel_footer button {
  width: 100% !important;
}
.panel-element .items {
  padding: 0;
  display: flex;
  gap: 1.5rem;
}
.panel-element .items > section {
  display: flex;
  flex-wrap: wrap;
  gap: var(--universal-space);
}
.panel-element .items > section > article {
  background: var(--c-white);
  padding: var(--universal-space-half);
  border-radius: var(--border-radius);
  width: 100%;
}
.panel-element .items > section > article .li-layout {
  padding: 0;
}
.panel-element .items > section > article .item-delete button {
  color: var(--c-red);
}
.panel-element .items > section picture {
  display: block;
  position: relative;
}
.panel-element .items > section picture img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  object-fit: cover;
}
.panel-element .items > section picture {
  padding-top: 100%;
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow-1);
  overflow: hidden;
}

.product-card {
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow-1);
}
.product-card .dxp-block-linkable-link a {
  z-index: 1;
  border-radius: var(--border-radius);
}
.product-card .dxp-block-linkable-link a:hover {
  background: rgba(0, 0, 0, 0.05);
}
.product-card .slds-grid {
  flex-wrap: wrap;
}
.product-card .slds-size--1-of-2, .product-card .slds-size_1-of-2 {
  width: 100%;
}
.product-card .slds-size_1-of-2:first-of-type {
  display: block;
  position: relative;
}
.product-card .slds-size_1-of-2:first-of-type img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  object-fit: cover;
}
.product-card .slds-size_1-of-2:first-of-type {
  padding-top: 75%;
  border-radius: 15px 15px 0 0;
  overflow: hidden;
}
.product-card dxp_content_layout-block-background-image.lwc-q33ma6oas1.lwc-2jronin66ql-host {
  position: absolute;
  width: 100%;
  height: 100%;
  background-size: cover;
  top: 0;
}
.product-card .main-content-container {
  padding: var(--universal-space-2) var(--universal-space) !important;
}
.product-card--small-image .dxp-block-image-host {
  max-width: 100px;
  max-height: 160px;
  margin: 0 auto;
}
.product-card--small-image .slds-size_1-of-2:first-of-type {
  padding-top: 50%;
}

.lwc-20bef5plkfo.content-container {
  display: grid;
  gap: var(--universal-space);
}
@media screen and (min-width: 768px) {
  .lwc-20bef5plkfo.content-container {
    gap: var(--universal-space-2);
  }
}
@media screen and (min-width: 992px) {
  .lwc-20bef5plkfo.content-container {
    gap: var(--universal-space-3);
  }
}

.product-grid-container {
  gap: var(--universal-space);
  padding: 0 !important;
}
.product-grid-container .cardContainerGrid {
  border: 1px solid var(--c-alt-white) !important;
  border-radius: var(--border-radius) !important;
  background: var(--c-white) !important;
  padding: 0 !important;
}
.product-grid-container .cardContainerGrid .imageArea {
  display: block;
  position: relative;
}
.product-grid-container .cardContainerGrid .imageArea img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  object-fit: cover;
}
.product-grid-container .cardContainerGrid .imageArea {
  padding-top: 75%;
  border: 0 0 1px 0 solid var(--c-off-white) !important;
}
.product-grid-container .cardContainerGrid .slds-truncate {
  white-space: normal !important;
}
.product-grid-container .cardContainerGrid .fieldsArea, .product-grid-container .cardContainerGrid .priceArea, .product-grid-container .cardContainerGrid .callToActionArea {
  padding: var(--universal-space-half);
}
.product-grid-container .cardContainerGrid .fieldsArea * {
  font-size: 18px !important;
}

.grid-item {
  flex-basis: 100% !important;
  border: none !important;
}
@media screen and (min-width: 768px) {
  .grid-item {
    flex-basis: 50% !important;
  }
}
@media screen and (min-width: 992px) {
  .grid-item {
    flex-basis: 31.8% !important;
  }
}

.sort-menu-dropdown .slds-button {
  font-weight: 400 !important;
  padding: 0 !important;
  background: none !important;
}
.sort-menu-dropdown .slds-button:hover {
  color: var(--c-black) !important;
}

.header-container {
  margin: 0 !important;
}

.cardContainerGrid {
  border-radius: 15px;
  box-shadow: var(--box-shadow-1);
}
.cardContainerGrid .fieldsArea {
  padding: var(--universal-space-2) var(--universal-space) !important;
}
.cardContainerGrid .priceArea {
  display: none !important;
}

.lwc-26kv81bckgr {
  padding: 0;
}
.lwc-26kv81bckgr li.li-layout {
  border-radius: var(--border-radius) !important;
  padding: var(--universal-space-2) var(--universal-space);
}

.button-container {
  display: flex;
  gap: var(--universal-space);
}

.sfpp-component {
  padding: var(--universal-space-2) var(--universal-space);
  background: var(--c-panels) !important;
  border-radius: var(--border-radius) !important;
}

.slds-accordion__summary-action, .slds-accordion__summary {
  background: none !important;
}

.navigation.slds-border_right {
  border: 1px solid var(--c-alt-white) !important;
  border-radius: var(--border-radius) !important;
  background: var(--c-panels) !important;
  padding: 0 !important;
  overflow: hidden;
}
.navigation.slds-border_right a {
  color: var(--c-black);
  font-weight: 400 !important;
  text-decoration: none !important;
}

.slds-nav-vertical__item:hover a {
  color: var(--c-white) !important;
}

.slds-nav-vertical__item.slds-is-active:before, .slds-nav-vertical__item:hover:before {
  background: var(--c-teal) !important;
}

.slds-nav-vertical__action {
  box-shadow: none !important;
}
.slds-nav-vertical__action:hover {
  background: var(--c-teal) !important;
}

.slds-is-active a {
  color: var(--c-white) !important;
}

#my-account-layout-content {
  margin: 0 auto !important;
  padding: var(--universal-space) 0 !important;
}
#my-account-layout-content .comm-section-container {
  padding: var(--universal-space-2) 0 var(--universal-space-2) 0 !important;
}
#my-account-layout-content .content.lwc-5g35a4nm657 {
  padding: var(--universal-space-2) 0 var(--universal-space-2) var(--universal-space-2) !important;
}

[lwc-3uma98d0eu4-host] {
  background: var(--c-panels) !important;
  padding: var(--universal-space) !important;
  border-radius: var(--blur-radius) !important;
  box-shadow: var(--box-shadow-1) !important;
}

.navigation-bar__right-align {
  display: flex;
  flex-wrap: wrap;
  gap: var(--universal-space);
}

footer[lwc-7g95h202aim] {
  background: none !important;
}

flowruntime-navigation-bar.slds-card__footer.navigationBar {
  margin-top: var(--universal-space);
  padding: 0 !important;
  border: none !important;
}

.slds-progress__item.slds-is-active .slds-progress__marker, .slds-progress__item.slds-is-completed .slds-progress__marker {
  border-color: var(--c-purple) !important;
}

.slds-path__nav .slds-is-active {
  background: var(--c-teal) !important;
}

.slds-path__nav .slds-is-active::after, .slds-path__nav .slds-is-active::before {
  background: var(--c-teal) !important;
}

.slds-path__nav .slds-is-complete, .slds-path__nav .slds-is-complete:after, .slds-path__nav .slds-is-complete:before {
  background: var(--c-purple) !important;
}

ul.slds-path__nav {
  border: 1px solid var(--c-white);
  background: var(--c-white);
}

ul.slds-truncate {
  margin-top: var(--universal-space);
}

.slds-pill {
  background: var(--c-teal);
  color: var(--c-white);
  border: none;
  padding: var(--universal-space-half) var(--universal-space) !important;
  border: var(--border-radius);
}

.expandable-section {
  padding: var(--universal-space) 0 !important;
}
.expandable-section .section-header {
  padding: var(--universal-space-half) 0 !important;
  background: var(--c-white);
  border: 1px 0px 1px 0px var(--c-off-black) solid;
}
.expandable-section .section-header:hover {
  background: var(--c-off-white);
}
.expandable-section .content {
  padding: var(--universal-space-half) 0 !important;
}
