/* BUTTON */
a.slds-button:not(.slds-button_icon),
button.slds-button:not(.slds-button_icon) {
    --dxp-s-button-font-size: 0.8125rem;
    --dxp-s-button-line-height: 2rem;
}

.slds-button.dxp-button-small {
    --dxp-s-button-small-font-size: 0.8125rem;
    --dxp-s-button-line-height: 1.625rem;
    --dxp-s-button-font-weight: 400;
    --dxp-s-button-text-transform: none;
}

.slds-button.slds-button_icon.slds-button_icon-bare.slds-button_icon-inverse {
    --sds-c-button-shadow-focus: 0 0 3px var(--dxp-g-root);
    color: var(--dxp-g-root);
    transition: color 0.1s ease-in-out;
}

.slds-button.slds-button_icon.slds-button_icon-bare.slds-button_icon-inverse:hover {
    color: var(--dxp-g-neutral);
}

.slds-button.slds-button--brand:focus,
.slds-button.slds-button_brand:focus {
    color: var(--sds-c-button-brand-text-color-focus);
}

.b2b-button_action,
.slds-button.b2b-button_action {
    font-size: var(--b2b-button-action-font-size);
    line-height: var(--b2b-button-action-line-height);
    font-weight: var(--b2b-button-action-font-weight);
    text-decoration: var(--b2b-button-action-text-decoration);
    text-transform: var(--b2b-button-action-text-transform);
}

.b2b-button_action {
    color: var(--dxp-g-brand);
    transition: color 0.1s;
}

.b2b-button_action:hover,
.b2b-button_action:focus {
    color: var(--dxp-g-brand-1);
}

.b2b-button_action:active {
    color: var(--dxp-g-brand-2);
}

.b2b-button_action[disabled="true"] {
    cursor: not-allowed;
    text-decoration: none !important;
    color: var(--b2b-colorDisabled) !important;
}

.slds-button[disabled] {
    cursor: not-allowed;
}

 

/* LAYOUT */

community_layout-column[slot="columns"].col-large-size_12-of-12.col-size_12-of-12.community_layout-column_column-host {
    display: block;
}

.b2c_lite_commerce-commerceLayout_commerceLayout {
    position: relative;
}

.commerce_builder-cartContents_cartContents.cart-spinner.slds-spinner_container {
    background-color: transparent !important;
}

/* TOOLTIP */

lightning-primitive-bubble .slds-popover .slds-popover__body {
    white-space: pre-line;
}

/* SPINNER */

lightning-spinner.slds-spinner_container {
    z-index: 1;
}

/* OUTLINE FOR REGIONS */

[data-f6-region]:focus-within {
    outline: 0 !important;
    outline-offset: 0 !important;
}
/* FORM. LIGHTNING COMBOBOX */

lightning-combobox .slds-input_faux.slds-is-disabled {
    color: var(--dxp-c-input-text-color-disabled);
}

lightning-combobox .slds-listbox.slds-dropdown {
    z-index: 990;
}

/* POPPINS */

@font-face {
    font-family: 'Poppins';
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url('/shop/sfsites/c/resource/b2bStyle/poppins/Poppins-Regular.woff2') format('woff2'),
         url('/shop/sfsites/c/resource/b2bStyle/poppins/Poppins-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-weight: 500;
    font-style: normal;
    font-display: swap;
    src: url('/shop/sfsites/c/resource/b2bStyle/poppins/Poppins-Medium.woff2') format('woff2'),
         url('/shop/sfsites/c/resource/b2bStyle/poppins/Poppins-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-weight: 600;
    font-style: normal;
    font-display: swap;
    src: url('/shop/sfsites/c/resource/b2bStyle/poppins/Poppins-SemiBold.woff2') format('woff2'),
         url('/shop/sfsites/c/resource/b2bStyle/poppins/Poppins-SemiBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url('/shop/sfsites/c/resource/b2bStyle/poppins/Poppins-Bold.woff2') format('woff2'),
         url('/shop/sfsites/c/resource/b2bStyle/poppins/Poppins-Bold.ttf') format('truetype');
}

/* FOOTER */
b2c_lite_commerce-commerce-footer {
    --dxp-c-component-wrapper-spacer-size: 0;
    --dxp-c-footer-container-spacing-block-start: 0;
    --dxp-c-footer-container-spacing-inline-end: 0;
    --dxp-c-footer-container-spacing-block-end: 0;
    --dxp-c-footer-container-spacing-inline-start: 0;
    --dxp-c-component-wrapper-spacer-size-mobile: 0;
    --dxp-c-footer-container-spacing-inline-end-mobile: 0;
    --dxp-c-footer-container-spacing-inline-start-mobile: 0;
}

footer.b2c_lite_commerce-commerceFooter_commerceFooter {
    background-color: var(--b2b-footer-backgroundColor, var(--dxp-g-root-contrast, #000000)) !important;
    padding: 0 !important;
}

/* GRID */

.b2b-container {
    margin: 0 auto;
    padding: 0 var(--b2b-theme-contentHorizontalPaddings, 0);
    max-width: calc(var(--b2b-theme-containerMaxWidth, 100%) + var(--b2b-theme-contentHorizontalPaddings, 0) * 2);
}

.b2b-row {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% + var(--b2b-theme-contentHorizontalPaddings, 0) * 2);
    margin-left: calc(var(--b2b-theme-contentHorizontalPaddings, 0) * -1);
    margin-right: calc(var(--b2b-theme-contentHorizontalPaddings, 0) * -1);
}

.b2b-col {
    width: 100%;
    padding: 0 var(--b2b-theme-contentHorizontalPaddings, 0);
}

/* HEADER */

.header[name="header"] {
    background-color: var(--b2b-header-background-color, #FFFFFF) !important;
}

.header header {
    padding: 1rem var(--b2b-theme-contentHorizontalPaddings) !important;
    box-shadow: var(--b2b-header-shadow);
    background-color: var(--b2b-header-background-color, #FFFFFF) !important;
}

.header .header-content {
    margin: 0 auto;
    max-width: var(--b2b-header-max-width) !important;
}

.header .header-content > div {
    margin: 0 !important;
}

.header .header-logo,
.header .header-navigation,
.header .header-search,
.header .header-badge-icons {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.header .header-logo {
    width: 247px;
    padding-right: 39px !important;
}

.header .header-navigation {
    width: calc(100% - 247px - 370px - 190px);
}

.header .header-search {
    width: 370px;
    padding-left: 46px !important;
    padding-right: 46px !important;
}

.header .header-badge-icons {
    width: 190px;
}

.header .header-account {
    padding-right: 0.75rem;
}

@media screen and (max-width: 1499.98px) {
    .header header.b2c_lite_commerce-commerceHeader_commerceHeader {
        padding: 1rem var(--b2b-theme-contentHorizontalPaddings) 0.5rem var(--b2b-theme-contentHorizontalPaddings) !important;
    }
    .header .header-logo {
        order: 1;
        width: 247px;
        padding-right: 39px !important;
    }
    .header .header-navigation {
        order: 4;
        width: 100%;
        padding-left: 247px !important;
    }
    .header .header-search {
        order: 2;
        width: calc(100% - 247px - 190px);
        padding-left: 0px !important;
        padding-right: 60px !important;
    }
    .header .header-badge-icons {
        order: 3;
    }
}

@media screen and (max-width: 1023.98px) {
    .header .header-search {
        margin-top: 0 !important;
        padding-right: 39px !important;
    }
    .header .header-badge-icons {
        position: relative !important;
        height: auto !important;
    }
}

@media screen and (max-width: 991.98px) {
    .header .header-navigation {
        margin-top: 0.5rem;
        padding-left: 0 !important;
    }
}

@media screen and (max-width: 767.98px) {
    .header .header-navigation {
        width: 52px;
        padding-right: 20px !important;
        order: 1;
        margin-top: 0;
    }
    .header .header-logo {
        width: calc(100% - 52px - 120px);
        order: 2;
        padding-right: 16px !important;
    }
    .header .header-badge-icons {
        width: 120px;
        order: 3;
    }
    .header .header-search {
        width: 100%;
        order: 4;
        margin-top: 0.5rem !important;
        padding-right: 0 !important;
    }
}

@media screen and (max-width: 574.98px) {
    .header header.b2c_lite_commerce-commerceHeader_commerceHeader {
        padding: 0.5rem var(--b2b-theme-contentHorizontalPaddings) !important;
    }
    .header .header-navigation {
        width: 44px;
        padding-right: 12px !important;
    }
    .header .header-logo {
        width: calc(100% - 44px - 120px);
        order: 2;
        padding-right: 12px !important;
    }
}

/* HEADER. SITE LOGO */

dxp_content_layout-site-logo {
    display: flex;
}

dxp_content_layout-site-logo .dxp-content-layout-site-logo {
    background-position: left center;
}

@media screen and (max-width: 574.98px) {
    dxp_content_layout-site-logo .dxp-content-layout-site-logo {
        width: 151px !important;
    }
}

@media screen and (max-width: 479.98px) {
    dxp_content_layout-site-logo .dxp-content-layout-site-logo {
        width: 108px !important;
    }
}

/* HEADER. SEARCH */

b2b_search_suggestions-input .input-wrapper input[type="search"] {
    font-size: 13px;
}

b2b_search_suggestions-input .input-search-button {
    transition: background-color 0.1s;
}

b2b_search_suggestions-input .input-search-button:hover,
b2b_search_suggestions-input .input-search-button:focus {
    background-color: var(--dxp-g-brand) !important;
}



/* NAVIGATION MENU. TOGGLE BUTTON */

commerce-drilldown-navigation > lightning-button-icon > .slds-button_icon {
    color: var(--dxp-g-brand-contrast) !important;
    transition: color 0.1s;
}

commerce-drilldown-navigation > lightning-button-icon > .slds-button_icon:hover,
commerce-drilldown-navigation > lightning-button-icon > .slds-button_icon:focus,
commerce-drilldown-navigation > lightning-button-icon > .slds-button_icon:active {
    color: var(--dxp-g-brand) !important;
}

@media screen and (max-width: 767.98px) {
    commerce-drilldown-navigation > lightning-button-icon > .slds-button_icon {
        width: 32px;
        height: 32px;
    }
    commerce-drilldown-navigation > lightning-button-icon > .slds-button_icon .slds-button__icon {
        width: 24px;
        height: 24px;
    }
}

/* NAVIGATION MENU */

commerce-drilldown-navigation .comm-drilldown-navigation__bar > li > a,
commerce-drilldown-navigation .comm-drilldown-navigation__bar > li > button {
    font-size: 18px !important;
    font-weight: 500;
    color: var(--dxp-g-brand-contrast) !important;
    background-color: transparent !important;
    transition: color 0.1s ease-in-out !important;
}

commerce-drilldown-navigation .comm-drilldown-navigation__bar > li > a:hover,
commerce-drilldown-navigation .comm-drilldown-navigation__bar > li > button:hover {
    color: var(--dxp-g-brand) !important;
}

commerce-drilldown-navigation .comm-drilldown-navigation__bar > li:first-child > a {
    padding-left: 0 !important;
}

/* NAVIGATION MENU. DROPDOWN */

community_navigation-drilldown-navigation-list ul.slds-list_vertical {
    min-width: 240px !important;
    background-color: #FFFFFF !important;
    box-shadow: 0px 4px 4px rgb(0, 0, 0, 0.75) !important;
    border-radius: 5px !important;
    outline: 0 !important;
}

community_navigation-drilldown-navigation-list ul.slds-list_vertical > li {
    position: relative;
}

community_navigation-drilldown-navigation-list ul.slds-list_vertical > li:not(:empty) + li:not(:empty) {
    border-top: 1px solid #E6E6E6;
}

community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > a,
community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > button {
    padding: 8px 28px;
    font-size: 16px !important;
    text-transform: uppercase;
    color: #6B6B6B !important;
    background-color: var(--dxp-g-brand-contrast) !important;
    white-space: pre-line;
    transition: color 0.1s, background-color 0.1s !important;
}

community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > a:hover,
community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > a:focus,
community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > button:hover,
community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > button:focus {
    color: var(--dxp-g-brand-contrast) !important;
    background-color: var(--dxp-g-brand) !important;
}

community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > button > lightning-icon {
    top: 50% !important;
    padding-top: 0;
    transform: translateY(-50%);
}

@media screen and (max-width: 767.98px) {
    community_navigation-drilldown-navigation-list ul.slds-list_vertical {
        border-radius: 0 !important;
    }
    community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > a,
    community_navigation-drilldown-navigation-list ul.slds-list_vertical > li > button {
        padding: 12px 28px;
    }
    community_navigation-drilldown-navigation-list .comm-drilldown-navigation__close-button .slds-button_icon .slds-button__icon {
        transition: fill 0.1s;
    }
    community_navigation-drilldown-navigation-list .comm-drilldown-navigation__close-button .slds-button_icon:hover .slds-button__icon,
    community_navigation-drilldown-navigation-list .comm-drilldown-navigation__close-button .slds-button_icon:focus .slds-button__icon {
        fill: var(--dxp-g-brand);
    }
    community_navigation-drilldown-navigation-list .comm-drilldown-navigation__close-button .slds-button__icon {
        width: 20px;
        height: 20px;
    }
    community_navigation-drilldown-navigation-list li:empty + li.slds-list__item,
    community_navigation-drilldown-navigation-list li.comm-drilldown-navigation__close-button + li:not(:empty) {
        margin-right: 40px;
    }
}

/* USER PROFILE MENU */

commerce_my_account-user-profile-menu .slds-media {
    max-width: 10rem !important;
}

commerce_my_account-user-profile-menu .slds-media__body,
commerce_my_account-user-profile-menu .menu-trigger-p {
    max-width: 100% !important;
}

commerce_my_account-user-profile-menu .menu-trigger-p:first-child {
    font-size: 12px;
    font-weight: 400;
    text-transform: none;
}

commerce_my_account-user-profile-menu .menu-trigger-p:last-child {
    font-size: 12px;
    text-transform: none;
}

commerce_my_account-user-profile-menu .menu-button {
    color: var(--dxp-g-brand-contrast) !important;
    border: 0 !important;
    box-shadow: none !important;
}

commerce_my_account-user-profile-menu .menu-button:hover,
commerce_my_account-user-profile-menu .menu-button:focus {
    color: var(--dxp-g-brand) !important;
    background-color: transparent !important;
    transition: color 0.1s;
}

commerce_my_account-user-profile-menu .menu-button .slds-icon-utility-chevrondown {
    display: none;
    visibility: hidden;
    width: 1px;
    height: 1px;
    opacity: 0;
}

commerce_my_account-user-profile-menu .menu-button .slds-icon {
    width: 30px;
    height: 20px;
    fill: var(--dxp-g-brand-contrast) !important;
    transition: fill 0.1s;
}

commerce_my_account-user-profile-menu .menu-button:hover .slds-icon,
commerce_my_account-user-profile-menu .menu-button:focus .slds-icon {
    fill: var(--dxp-g-brand) !important;
}

/* USER PROFILE MENU. DROPDOWN */

commerce_my_account-user-profile-menu .slds-dropdown {
    max-width: 14rem;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    box-shadow: 0px 4px 4px rgb(0, 0, 0, 0.75);
    border: 0;
    border-radius: 5px;
}

commerce_my_account-user-profile-menu .slds-dropdown__item {
    width: 100% !important;
    border-bottom: 0 !important;
}

commerce_my_account-user-profile-menu .slds-dropdown__item:nth-child(3) {
    border-radius: 5px 5px 0 0;
    overflow: hidden;
}

commerce_my_account-user-profile-menu .slds-dropdown__item:last-child {
    border-radius: 0 0 5px 5px;
    overflow: hidden;
}

commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu,
commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu:hover,
commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu:focus {
    padding: 6px 24px;
    font-size: 13px;
    transition: color 0.1s, background-color 0.1s;
}

commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu:hover,
commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu:focus {
    color: var(--dxp-g-brand-contrast) !important;
    background-color: var(--dxp-g-brand) !important;
}

@media screen and (max-width: 1023.98px) {
    commerce_my_account-user-profile-menu .slds-dropdown {
        right: -7px;
    }
    commerce_my_account-user-profile-menu .slds-dropdown::after,
    commerce_my_account-user-profile-menu .slds-dropdown::before {
        left: unset !important;
        right: 1.5rem !important;
    }
    commerce_my_account-user-profile-menu .slds-dropdown__item:nth-child(1),
    commerce_my_account-user-profile-menu .slds-dropdown__item:nth-child(2) {
        display: none;
    }
    commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu,
    commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu:hover,
    commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu:focus {
        line-height: 1.6;
    }
}

@media screen and (max-width: 767.98px) {
    commerce_my_account-user-profile-menu .slds-dropdown {
        top: 65px !important;
        right: 1rem;
        left: 1rem;
        width: calc(100% - 2rem) !important;
        inset-inline-start: unset !important;
    }
    commerce_my_account-user-profile-menu .slds-dropdown .menu-nubbin {
        inset-inline-start: unset;
        margin-inline-start: unset;
        margin-inline-end: unset;
        right: 45px;
        left: unset !important;
    }
    commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu,
    commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu:hover,
    commerce_my_account-user-profile-menu .slds-dropdown__item a.commerce_my_account-userProfileMenu_userProfileMenu:focus {
        line-height: 2;
    }
}

/* USER PROFILE MENU. LOGIN BUTTON */

commerce_builder-user-profile-menu a.login-link {
    display: block;
    padding: 0 12px;
    border: 1px solid var(--dxp-g-brand-contrast) !important;
    border-radius: 4px;
    text-decoration: none !important;
    background-color: transparent !important;
    transition: border-color 0.1s;
}

commerce_builder-user-profile-menu a.login-link:hover,
commerce_builder-user-profile-menu a.login-link:focus {
    border-color: var(--dxp-g-brand) !important;
    background-color: transparent !important;
}

commerce_builder-user-profile-menu a.login-link .login-text {
    display: block !important;
    padding: 0 !important;
    font-size: 0.875rem;
    line-height: calc(2rem - 2px);
    text-transform: uppercase;
    color: var(--dxp-g-brand-contrast) !important;
    transition: color 0.1s;
}

commerce_builder-user-profile-menu a.login-link:hover .login-text,
commerce_builder-user-profile-menu a.login-link:focus .login-text {
    color: var(--dxp-g-brand) !important;
}

commerce_builder-user-profile-menu a.login-link lightning-icon {
    display: none;
}

/* CART BADGE */

commerce_builder-cart-badge .slds-notification-badge {
    background-color: var(--dxp-g-brand) !important;
}

/* HEADER: PHONE NUMBER */

community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"],
community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"]:hover,
community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"]:focus,
community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"]:active,
community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"],
community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"]:hover,
community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"]:focus,
community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"]:active {
    pointer-events: none;
    cursor: default;
}

community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"],
community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"]:hover,
community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"]:focus,
community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"]:active {
    color: var(--dxp-g-brand-contrast) !important;
}

community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"],
community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"]:hover,
community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"]:focus,
community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"]:active {
    color: #6B6B6B !important;
}

community_navigation-drilldown-navigation-bar > nav > ul > li:last-child > button[title*="1-800"] lightning-icon,
community_navigation-drilldown-navigation-list > nav > ul > li:last-child > button[title*="1-800"] lightning-icon {
    display: none;
}

/* HOME PAGE. TILES */

community_navigation-tile-menu community_navigation-tile-menu-ui {
    width: calc(100% + 20px);
    justify-content: flex-start !important;
    grid-row-gap: 20px;
    margin-left: -10px;
    margin-right: -10px;
}

community_navigation-tile-menu community_navigation-tile-menu-item {
    width: 33.33% !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

@media screen and (max-width: 1023.98px) {
    community_navigation-tile-menu community_navigation-tile-menu-item {
        width: 50% !important;
    }
}

@media screen and (max-width: 767.98px) {
    community_navigation-tile-menu community_navigation-tile-menu-item {
        width: 100% !important;
    }
}

/* COMMUNITY NAVIGATION TILE MENU ITEM */

community_navigation-tile-menu-item .comm-tile-menu__item-link {
    max-width: 100% !important;
    border: 1px solid #CECBCB !important;
}

community_navigation-tile-menu-item community_navigation-tile-menu-item-separate-layout {
    display: flex !important;
    flex-direction: column;
    height: 223px;
}

community_navigation-tile-menu-item community_navigation-tile-menu-item-banner {
    display: flex;
    justify-content: center;
    align-items: center;
    order: 2;
    height: 80px !important;
    border-top: 5px solid var(--dxp-g-brand);
    background-color: var(--dxp-g-root);
    transition: border-color 0.1s, background-color 0.1s !important;
}

community_navigation-tile-menu-item .comm-tile-menu__item-title {
    font-size: 24px !important;
    line-height: 1.2;
    font-weight: 500;
    text-align: center;
    text-transform: uppercase !important;
    text-decoration: none !important;
    color: var(--b2b-color-text) !important;
    background-color: transparent !important;
    transition: color 0.1s !important;
}

@media screen and (max-width: 1023.98px) {
    community_navigation-tile-menu-item .comm-tile-menu__item-title {
        font-size: 20px !important;
    }
}

@media screen and (max-width: 767.98px) {
    community_navigation-tile-menu-item .comm-tile-menu__item-title {
        font-size: 18px !important;
    }
}

community_navigation-tile-menu-item .comm-tile-menu__item-link:hover community_navigation-tile-menu-item-banner {
    border-top: 5px solid var(--dxp-g-brand-contrast);
    background-color: var(--dxp-g-brand) !important;
}

community_navigation-tile-menu-item .comm-tile-menu__item-link:hover .comm-tile-menu__item-title {
    color: var(--dxp-g-brand-contrast) !important;
}

community_navigation-tile-menu-item .comm-tile-menu__item-image {
    order: 1;
    height: 143px !important;
}

/* PDP. LAYOUT */

commerce_data_provider-product-data-provider community_layout-column > .community_layout-column_column.column-content {
    max-width: 100%;
}

/* PDP. BREADCRUMBS */

commerce_data_provider-product-data-provider commerce-breadcrumbs ol.commerce-breadcrumbs_breadcrumbs {
    font-size: 0.875rem;
}

commerce_data_provider-product-data-provider commerce-breadcrumbs ol.commerce-breadcrumbs_breadcrumbs li.commerce-breadcrumbs_breadcrumbs {
    padding-left: 0.75rem;
}

commerce_data_provider-product-data-provider commerce-breadcrumbs ol.commerce-breadcrumbs_breadcrumbs li.commerce-breadcrumbs_breadcrumbs:before {
    padding-right: 0.75rem;
}

/* PDP. IMAGE GALLERY */

commerce_product_details-gallery-image {
    width: 100% !important;
    height: 440px !important;
    display: block;
    overflow: hidden;
}

commerce_product_details-gallery-image experience-picture picture.experience-picture_picture {
    display: flex;
    justify-content: center;
    align-items: center;
}

commerce_product_details-gallery-image experience-picture picture.experience-picture_picture > img.experience-picture_picture {
    object-fit: contain;
}

@media screen and (max-width: 767.98px) {
    commerce_product_details-gallery-image {
        height: 360px !important;
    }
}

commerce_data_provider-product-data-provider .commerce_product_details-galleryImage_galleryImage-host {
    padding: 0.5rem;
}

commerce_data_provider-product-data-provider commerce_product_details-gallery-image button.image-container:focus-visible {
    outline: none;
}

/* PDP. IMAGE GALLERY. MAIN/HERO IMAGE — never show a border here, per client reference
   (screenshot: "Never show the border here" pointing at the large hero image). Reset
   defensively since the visible border can come from the browser's default button
   chrome rather than an explicit rule. */
commerce_data_provider-product-data-provider commerce_product_details-gallery-image button.image-container {
    border: none !important;
    box-shadow: none !important;
}

@media screen and (max-width: 1023px) {
    commerce_data_provider-product-data-provider commerce_product_details-gallery-image.commerce_product_details-galleryImage_galleryImage-host {
        width: 100%;
    }
}

@media screen and (max-width: 479px) {
    commerce_data_provider-product-data-provider commerce_product_details-gallery-image.mobile-gallery-image.commerce_product_details-gallery_gallery {
        width: 100%;
    }
}

commerce_product_details-carousel experience-picture.commerce_product_details-carousel_carousel {
    padding: 0.25rem;
}

commerce_product_details-carousel experience-picture.commerce_product_details-carousel_carousel > .experience-picture_picture {
    padding: 0;
}

/* PDP. THUMBNAILS — verified via DevTools outerHTML:
   <div class="thumbnail-container"><div class="thumbnail-carousel">
     <ul role="tablist"><li><button class="slds-button thumbnail-carousel-image"
       role="tab" aria-selected="true|false">...</button></li>...</ul>
   </div></div>
   No border by default; red border (same red as the category-tile hover, see
   b2bCategoryList.css .b2b-category-list__item:hover) on hover AND while a
   thumbnail is the active/selected one (aria-selected="true"), so it stays red
   after clicking, not just while the mouse is over it. */
.thumbnail-container button.thumbnail-carousel-image {
    box-sizing: border-box;
    border: 2px solid transparent;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.thumbnail-container button.thumbnail-carousel-image:hover,
.thumbnail-container button.thumbnail-carousel-image[aria-selected="true"] {
    border-color: #ED1B2D !important;
    box-shadow: inset 0 0 1px 1px #ED1B2D !important;
}

/* PDP. IMAGE ZOOM (contained, cursor-tracked — see darleyPDPScripts.js for the pan logic)
   Hides the native overflowing zoom panel (was covering the product description) and
   turns the hero image itself into the zoom viewport, clipped to its own bounds. */
[data-automation="thumbnailGalleryZoomedImageContainer"] {
    display: none !important;
}

/* Salesforce's own native zoom indicator — an empty <div class="zoom-lens"> it
   positions/sizes itself on hover as a semi-transparent tracking box. Verified
   via DevTools outerHTML: it's a sibling of .image-container inside
   .zoom-hero-container. Left visible, it renders on top of our own
   cursor-tracked scaled image below, producing a double-exposed "ghost box"
   look. Hidden so only our custom zoom shows. */
.zoom-lens {
    display: none !important;
}

/* NOTE: previously scoped as "commerce-thumbnail-gallery .zoom-hero-container",
   but there's no <commerce-thumbnail-gallery> ancestor in the real DOM (verified
   via DevTools outerHTML — the real ancestor is .hero-container), so that
   selector never matched anything and this clipping never actually applied. */
.zoom-hero-container {
    position: relative;
    overflow: hidden;
    cursor: zoom-in;
}

/* Zoom now activates on click (darleyPDPScripts.js toggles this class) rather
   than on hover, so the cursor should invite a click to undo it too. */
.zoom-hero-container.is-zoomed {
    cursor: zoom-out;
}

.zoom-hero-container img {
    width: 100%;
    height: auto;
    transform-origin: center center;
    /* No transition: the zoomed view must track the cursor immediately, with no
       lag, so panning never feels like it's snapping back. */
}



/* PDP. HEADER */

commerce_data_provider-product-data-provider commerce_builder-heading.component-wrapper-spacer {
    margin-bottom: 1.75rem;
}

commerce_data_provider-product-data-provider commerce_builder-heading h1.dxp-text-block {
    font-size: 1.5rem;
    line-height: 1.3;
    font-weight: 500;
    
}

@media screen and (max-width: 767.98px) {
    commerce_data_provider-product-data-provider commerce_builder-heading h1.dxp-text-block {
        font-size: 1.125rem;
    }
}

commerce_data_provider-product-data-provider commerce_builder-heading [slot="heading"] + div {
    align-items: center;
    color: var(--text-color-gray-2);
    border-bottom: 1px solid var(--dxp-s-form-element-color-border);
    padding-bottom: 1rem;
    padding-top: 0.25rem;
}

@media screen and (max-width: 1023px) {
    commerce_data_provider-product-data-provider commerce_builder-heading h1.dxp-text-block {
        margin-top: 3.5rem;
    }
}

@media screen and (max-width: 768px) {
    commerce_data_provider-product-data-provider commerce_builder-heading h1.dxp-text-block {
        margin-top: 2.75rem;
    }
}

@media screen and (max-width: 479px) {
    commerce_data_provider-product-data-provider commerce_builder-heading h1.dxp-text-block {
        margin-top: 1.25rem;
    }
}

/* PDP. VARIANT SELECTOR */

commerce_data_provider-product-data-provider commerce_builder-variant-selector.component-wrapper-spacer {
    margin-bottom: 0;
}

commerce_data_provider-product-data-provider commerce_product_details-variant-selector.commerce_product_details-variantSelector_variantSelector-host {
    max-width: none;
    padding-top: 0;
    margin-top: -0.5rem;
    padding-bottom: 1rem;
}

commerce_data_provider-product-data-provider commerce_product_details-variant-selector [slot="heading"] {
    margin-bottom: 0.75rem;
}

commerce_data_provider-product-data-provider commerce_product_details-variant-selector h2.dxp-text-block {
    font-weight: 700;
}

commerce_data_provider-product-data-provider commerce_product_details-variant-selector .slds-form-element:not(:last-child).commerce_product_details-variantSelector_variantSelector {
    margin-bottom: 0.5rem;
}

commerce_data_provider-product-data-provider commerce_product_details-variant-selector .slds-form-element .slds-form-element__label {
    font-size: 0.75rem;
    color: var(--dxp-g-root-contrast);
}

/* PDP. PRICE */

commerce_data_provider-product-data-provider commerce_builder-product-pricing.component-wrapper-spacer {
    margin-bottom: 1.75rem;
    
}

commerce_data_provider-product-data-provider commerce_builder-product-pricing tr.commerce-productPricing_productPricing:nth-child(2) > td:nth-child(1) {
    padding-top: 0.5rem;
}

commerce_data_provider-product-data-provider commerce_builder-product-pricing tr.commerce-productPricing_productPricing > td:nth-child(1) {
    color: var(--text-color-gray-2);
    font-size: 0.875rem;
}

commerce_data_provider-product-data-provider commerce_builder-product-pricing .negotiated-price.price-label {
    font-size: 1.5rem;
}

commerce_data_provider-product-data-provider commerce_builder-product-pricing .original-price.price-label {
    font-size: 1.25rem;
    color: var(--text-color-gray-2);
}

commerce_data_provider-product-data-provider commerce_builder-product-pricing .price-unavailable {
    font-size: 1.25rem;
}

commerce_data_provider-product-data-provider webruntime-slot-container > c-b2b-wrapper-sidebar > .b2b-wrapper-sidebar__wrapper .b2b-wrapper-sidebar__sidebar:not(:has(commerce_builder-purchase-options)) {
    display: none;
}

@media screen and (max-width: 768px) {
    commerce_data_provider-product-data-provider commerce_builder-product-pricing table.commerce-productPricing_productPricing {
        justify-content: flex-start;
    }
    commerce_data_provider-product-data-provider commerce_builder-product-pricing tr.commerce-productPricing_productPricing > td:nth-child(1) {
        text-align: left;
    }
    commerce_data_provider-product-data-provider commerce_builder-product-pricing .price-unavailable.commerce-productPricing_productPricing {
        text-align: left;
    }
}

/* PDP. QUANTITY SELECTOR */

commerce_data_provider-product-data-provider commerce_builder-purchase-options.component-wrapper-spacer {
    margin-bottom: 0;
    
}

commerce_data_provider-product-data-provider commerce_builder-purchase-options .quantity-list-action {
    margin-bottom: 1rem;
    
}

commerce_data_provider-product-data-provider commerce_builder-purchase-options .commerce_product_details-addQuantity_addQuantity-host {
    margin-top: 0;
}

commerce_data_provider-product-data-provider commerce_builder-purchase-options commerce-quantity-selector.commerce_product_details-addQuantity_addQuantity {
    margin-right: 1.25rem;
}

commerce_data_provider-product-data-provider commerce_builder-purchase-options commerce-quantity-selector .number-input__input {
    width: 5.25rem;
    font-weight: 700;
    font-size: 1.125rem;
}

commerce_data_provider-product-data-provider commerce_builder-purchase-options commerce-quantity-selector .number-input__decrement-button,
commerce_data_provider-product-data-provider commerce_builder-purchase-options commerce-quantity-selector .number-input__increment-button {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

commerce_data_provider-product-data-provider commerce_builder-purchase-options commerce-quantity-selector lightning-icon {
    transform: scale(0.8);
}

@media screen and (max-width: 768px) {
    commerce_data_provider-product-data-provider commerce_builder-purchase-options .commerce_product_details-addQuantity_addQuantity.container {
        flex-direction: row;
    }
    commerce_data_provider-product-data-provider commerce_builder-purchase-options commerce_product_details-add-to-cart-button.commerce_product_details-addToCartButton_addToCartButton-host {
        flex-grow: 0;
    }
    commerce_data_provider-product-data-provider commerce_builder-purchase-options commerce-quantity-selector.commerce_product_details-addQuantity_addQuantity {
        margin-bottom: 0;
    }
}

@media screen and (max-width: 400px) {
    commerce_data_provider-product-data-provider commerce_builder-purchase-options .commerce_product_details-addQuantity_addQuantity.container {
        flex-direction: column;
        align-items: flex-start;
    }
    commerce_data_provider-product-data-provider commerce_builder-purchase-options commerce_product_details-add-to-cart-button.commerce_product_details-addToCartButton_addToCartButton-host {
        margin-top: 1.25rem;
    }
}

/* PDP. TIER DISCOUNTS */

commerce_data_provider-product-data-provider commerce_builder-pricing-tiers.component-wrapper-spacer {
    margin-bottom: 1rem;
}

commerce_data_provider-product-data-provider commerce_builder-pricing-tiers.component-wrapper-spacer > commerce_product_details-pricing-tiers {
    padding-top: 0;
}

commerce_data_provider-product-data-provider commerce_product_details-pricing-tiers dxp_base-text-block .dxp-text-block {
    font-size: 0.875rem;
}

commerce_data_provider-product-data-provider commerce_product_details-pricing-tiers .adjustment-tiers-container.commerce_product_details-pricingTiers_pricingTiers {
    border-color: var(--dxp-s-form-element-color-border);
    padding: 1rem;
    margin-top: 1rem;
}

commerce_data_provider-product-data-provider commerce_product_details-pricing-tiers .adjustment-tiers-container.commerce_product_details-pricingTiers_pricingTiers .commerce_product_details-pricingTiers_pricingTiers.tier {
    border-left-color: var(--dxp-s-form-element-color-border);
}

commerce_data_provider-product-data-provider commerce_product_details-pricing-tiers .tier-row-title {
    font-weight: 400;
}

commerce_data_provider-product-data-provider commerce_product_details-pricing-tiers .tier-row-title .tier-row-title-label:nth-child(2) {
    margin-top: 0.5rem;
}

commerce_data_provider-product-data-provider commerce_product_details-pricing-tiers .adjustment-tiers-container .tier-row-value {
    margin-top: 0.5rem;
}

/* PDP. EXPANDABLE SECTION */

commerce_data_provider-product-data-provider dxp_content_layout-expandable-section.dxp_content_layout-expandableSection_expandableSection-host {
    margin-bottom: 1.25rem;
    min-height: 2.5rem;
}

commerce_data_provider-product-data-provider dxp_content_layout-expandable-section lightning-icon.dxp_content_layout-expandableSection_expandableSection.p-start {
    transform: scale(0.8);
    padding-left: 0;
}

commerce_data_provider-product-data-provider dxp_content_layout-expandable-section summary .dxp_content_layout-expandableSection_expandableSection.title {
    padding-left: 0.375rem;
}

commerce_data_provider-product-data-provider dxp_content_layout-expandable-section summary .title h4 {
    font-size: 0.875rem;
}

commerce_data_provider-product-data-provider dxp_content_layout-expandable-section .dxp_content_layout-expandableSection_expandableSection.content {
    padding-left: 1.4375rem;
    margin-top: 0.5rem;
}

commerce_data_provider-product-data-provider dxp_content_layout-expandable-section dxp_base-text-block p.dxp-text-body {
    line-height: 180%;
}

commerce_data_provider-product-data-provider dxp_content_layout-expandable-section commerce_product_details-product-attachments > ul {
    display: flex;
    flex-direction: column;
    margin-top: 0.875rem;
}

commerce_data_provider-product-data-provider dxp_content_layout-expandable-section commerce_product_details-product-attachments .slds-icon_container > svg {
    fill: var(--dxp-g-brand);
}



/* BREADCRUMBS */

commerce_builder-breadcrumbs {
    display: block;
    margin-bottom: 22px;
}

@media screen and (max-width: 767.98px) {
    commerce_builder-breadcrumbs {
        margin-bottom: 1rem;
    }
}

/* PDP: ADD TO LIST */

[data-component-id="product-detail-add"] .b2b-wrapper-sidebar__sidebar,
[data-component-id="product-detail-add"] .b2b-wrapper-sidebar__content {
    width: auto !important;
}

[data-component-id="product-detail-add"] .b2b-favorite-list-add-to-list__button {
    font-size: 14px;
    line-height: 38px;
}

[data-component-id="product-detail-add"] .commerce_product_details-addToCartButton_addToCartButton {
    font-size: 14px;
    border-radius: 0;
    border-color: var(--b2b-color-text);
    background-color: var(--b2b-color-text);
}

[data-component-id="product-detail-add"] .commerce_product_details-addToCartButton_addToCartButton:hover,
[data-component-id="product-detail-add"] .commerce_product_details-addToCartButton_addToCartButton:focus {
    border-color: var(--dxp-g-brand);
    background-color: var(--dxp-g-brand);
}

/* PDP */

commerce_product_details-add-to-cart-button {
    margin-right: 0 !important;
}



/* CSS VARIABLES */

:root {
    --dxp-g-root-font-family: 'Poppins', 'Arial', 'Helvetica', sans-serif;
    --dxp-g-heading-font-family: 'Poppins', 'Arial', 'Helvetica', sans-serif;
    --b2b-theme-headerShadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    --b2b-theme-headerColor: #231F20;
    --b2b-footer-backgroundColor: #231F20;
    --b2b-theme-layoutMyAccountSidebarWidth: 360px;
    --b2b-theme-layoutMyAccountSidebarBackgroundColor: #F3F3F3;
    --b2b-theme-containerMaxWidth: var(--dxp-s-section-columns-max-width, 100%);
    --b2b-theme-contentVerticalPaddings: var(--dxp-s-section-content-spacing-block-start, 0);
    --b2b-theme-contentHorizontalPaddings: var(--dxp-s-section-content-spacing-inline-start, 0);
    --dxp-c-spinner-color-background: rgba(255, 255, 255, 0.75);
    --dxp-c-spinner-color-foreground: var(--dxp-g-neutral-2);
    --sds-c-button-brand-text-color: var(--dxp-g-brand-contrast);
    --sds-c-button-brand-text-color-hover: var(--dxp-g-brand-contrast);
    --sds-c-button-brand-text-color-focus: var(--dxp-g-brand-contrast);
    --sds-c-button-brand-text-color-active: var(--dxp-g-brand-contrast);
    --dxp-c-button-brand-transition: color 0.15s linear, border-color 0.15s linear, background-color 0.15s linear;
    --b2b-button-neutral-text-color: rgb(0, 0, 0);
    --sds-c-button-outline-brand-text-color-hover: var(--dxp-g-brand-1);
    --sds-c-button-outline-brand-text-color-focus: var(--dxp-g-brand-1);
    --sds-c-button-outline-brand-text-color-active: var(--dxp-g-brand-1);
    --sds-c-button-outline-brand-color-background-hover: rgb(19, 156, 216, 0.07);
    --sds-c-button-outline-brand-color-background-focus: rgb(19, 156, 216, 0.07);
    --sds-c-button-outline-brand-color-background-active: rgb(19, 156, 216, 0.07);
    --dxp-c-button-outline-brand-transition: color 0.15s linear, border-color 0.15s linear, background-color 0.15s linear;
    --b2b-button-action-font-size: 0.875rem;
    --b2b-button-action-line-height: 1.875rem;
    --b2b-button-action-font-weight: 700;
    --b2b-button-action-text-decoration: underline;
    --b2b-button-action-text-transform: none;
    --b2b-color-text: rgb(35, 31, 32);
    --b2b-color-primary: rgb(218, 41, 28);
    --b2b-color-black: rgb(0, 0, 5);
    --b2b-color-accent: rgb(35, 97, 146);
    --b2b-color-twitter: #00AEEF;
    --b2b-color-facebook: #093C71;
    --b2b-color-linkedin: #294694;
    --b2b-color-instagram: #E1306C;
    --b2b-color-youtube: #FF0000;
    --b2b-color-yelp: #E00707;
    --dxp-c-input-text-color-disabled: rgb(118, 113, 107);
    --b2b-header-max-width: var(--b2b-theme-containerMaxWidth, 100%);
    --b2b-header-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    --b2b-header-background-color: #231F20;
}

@media (max-width: 1023.98px) {
    :root {
        --b2b-theme-containerMaxWidth: var(--dxp-s-section-columns-max-width-tablet, 100%);
        --b2b-theme-contentVerticalPaddings: var(--dxp-s-section-content-spacing-block-start-tablet, 1.5rem);
        --b2b-theme-contentHorizontalPaddings: var(--dxp-s-section-content-spacing-inline-start-tablet, 1.5rem);
    }
}

@media (max-width: 767.98px) {
    :root {
        --dxp-s-text-heading-extra-large-font-size: 2rem;
        --b2b-theme-containerMaxWidth: var(--dxp-s-section-columns-max-width-mobile, 100%);
        --b2b-theme-contentVerticalPaddings: var(--dxp-s-section-content-spacing-block-start-mobile, 1rem);
        --b2b-theme-contentHorizontalPaddings: var(--dxp-s-section-content-spacing-inline-start-mobile, 0.75rem);
    }
}

