:root {
    /* Colors */
    --b2b-white: #ffffff;
    --b2b-black: #000000;
    --b2b-wave: #859cab;
    --b2b-wave-light: #bed0e7;
    --b2b-olive: #7b8476;
    --b2b-walnut: #947051;
    --b2b-walnut-light: #d9a058;
    --b2b-clay: #626457;
    --b2b-tea: #e1fdaa;
    --b2b-gray-100: #f4f4f4;
    --b2b-gray-200: #d3d3d3;
    --b2b-gray-300: #909192;
    --b2b-gray-400: #595a5c;
    --b2b-gray-500: #212325;
    --b2b-linen-100: #f9f0ea;
    --b2b-linen-200: #f4f0ea;
    --b2b-sunset-100: #fee1e0;
    --b2b-sunset-400: #d07463;
    --b2b-sunset-500: #ba0517;
    --b2b-gray-500-alpha: color(from var(--b2b-gray-500) srgb r g b / 0.15);

    --b2b-success: #10B981;
    --b2b-destructive: var(--b2b-sunset-500);
    --b2b-text-color: var(--b2b-gray-500);
    --b2b-border-color: var(--b2b-gray-200);

    /* Font Family */
    --b2b-font-family: 'aktiv-grotesk';

    /* Font Sizes */
    --b2b-font-size-xs: 0.75rem;
    --b2b-font-size-sm: 0.875rem;
    --b2b-font-size-md: 1rem;
    --b2b-font-size-lg: 1.125rem;
    --b2b-font-size-h1: 2rem;
    --b2b-font-size-h2: 1.625rem;
    --b2b-font-size-h3: 1.25rem;
    --b2b-font-size-h4: 1.125rem;
    --b2b-font-weight: 400;
    --b2b-font-weight-medium: 500;
    --b2b-font-weight-bold: 700;
    --b2b-line-height: 1.25em;

    /* Spacing */
    --b2b-spacing-3xs: 0.0625rem;
    --b2b-spacing-2xs: 0.125rem;
    --b2b-spacing-xs: 0.25rem;
    --b2b-spacing-sm: 0.5rem;
    --b2b-spacing-md: 0.75rem;
    --b2b-spacing-lg: 0.875rem;
    --b2b-spacing-xl: 1rem;
    --b2b-spacing-2xl: 1.5rem;
    --b2b-spacing-3xl: 2rem;
    --b2b-spacing-4xl: 2.75rem;
    --b2b-page-column-gap: 2rem;
    --b2b-page-padding-block: var(--b2b-spacing-4xl);
    --b2b-page-padding-inline: var(--b2b-spacing-2xl);
    --b2b-text-decoration-thickness: 0.125rem;
    --b2b-text-decoration-offset: 0.25rem;

    /* Radii */
    --b2b-radius-xs: 0.25rem;
    --b2b-radius-sm: 0.5rem;
    --b2b-radius-md: 0.75rem;
    --b2b-radius-lg: 1rem;
    --b2b-radius-xl: 1.25rem;
    --b2b-radius-round: 999rem;

    /* Shadows */
    --b2b-card-shadow: 0 5px 10px 1px var(--b2b-gray-500-alpha);

    /* Z-Indexes */
    --b2b-header-zindex: 9000;

    /* Root Max Width */
    --b2b-root-max-width: var(--dxp-c-section-columns-max-width, var(--dxp-c-l-max-content-width, var(--dxp-c-max-content-width, var(--dxp-s-section-columns-max-width))));

    /* Set in JavaScript */
    --b2b-header-height: 0;

    /* Transition Speeds */
    --b2b-mobile-nav-ta11y-duration: 500ms;

    /* Radio */
    --slds-c-radio-color-border-checked: var(--b2b-gray-300);
    --sds-c-radio-mark-color-foreground: var(--b2b-gray-500);

    /* Notifications */
    --slds-c-toast-radius-border: var(--b2b-radius-xs);
    --slds-c-toast-spacing-block-start: calc(var(--b2b-spacing-sm) + var(--b2b-spacing-lg));
    --slds-c-toast-spacing-block-end: var(--slds-c-toast-spacing-block-start);
    --slds-c-toast-spacing-inline-start: var(--b2b-spacing-lg);
    --slds-c-toast-spacing-inline-end: var(--b2b-spacing-lg);

    /* DXP Overrides */
    --dxp-g-destructive: var(--b2b-sunset-500);
    --dxp-g-destructive-1: var(--b2b-sunset-400);
    --dxp-g-destructive-contrast: var(--b2b-white);
    --dxp-g-destructive-1-contrast: var(--b2b-black);
    --dxp-g-success: var(--b2b-success);
    --dxp-g-success-contrast: var(--b2b-white);
    --dxp-s-text-heading-large-font-size: var(--b2b-font-size-h2);
    --dxp-s-text-heading-large-line-height: 1.15em;
    --dxp-c-spinner-color-foreground: var(--b2b-gray-500);
    --dxp-c-spinner-color-background: color(from var(--b2b-white) srgb r g b / 0.5);
    --dxp-s-form-element-text-line-height: 30px;

    /* Kinetics */
    --slds-kx-button-gradient-size: 0;
    --slds-kx-button-ripple-size: 0;
    --slds-kx-button-gradient-color: transparent;

    /* Fields */
    --slds-c-checkbox-color-background-checked: var(--b2b-gray-500);
    --slds-c-checkbox-color-border-checked: var(--b2b-gray-500);
    --slds-c-checkbox-mark-color-foreground: var(--b2b-white);

    /* Modals */
    --slds-c-modal-radius-border: var(--b2b-radius-sm);
    --slds-c-modal-sizing-border: 0;
    --slds-c-modal-heading-font-weight: var(--b2b-font-weight-medium);
    --slds-c-modal-header-color-background: var(--b2b-white);
    --slds-c-modal-heading-font-size: var(--b2b-font-size-h2);
    --slds-c-modal-heading-line-height: 1.4em;
    --slds-c-modal-header-spacing-block-start: var(--b2b-spacing-xl);
    --slds-c-modal-header-spacing-inline-end: 3.25rem;
    --slds-c-modal-header-spacing-block-end: 0;
    --slds-c-modal-header-spacing-inline-start: var(--b2b-page-column-gap);
    --slds-c-modal-content-color-background: var(--b2b-white);
    --slds-c-modal-footer-color-background: var(--b2b-white);
    --slds-c-modal-footer-spacing-block-start: 0;
    --slds-c-modal-footer-spacing-inline-end: var(--b2b-page-column-gap);
    --slds-c-modal-footer-spacing-block-end: var(--b2b-page-column-gap);
    --slds-c-modal-footer-spacing-inline-start: var(--b2b-page-column-gap);
    --slds-c-backdrop-color-background: rgba(0, 0, 0, 0.36);

    /* Tabs */
    --slds-c-tabs-item-spacing-block-end: var(--b2b-spacing-md);
    --slds-c-tabs-item-spacing-block-start: var(--b2b-spacing-md);
    --slds-c-tabs-item-spacing-inline-end: var(--b2b-spacing-xs);
    --slds-c-tabs-item-spacing-inline-start: var(--b2b-spacing-xs);
    --slds-c-tabs-item-sizing-height: initial;
    --slds-c-tabs-list-color-border: var(--b2b-gray-300);

    /* Button */
    --slds-c-button-text-color-active: var(--b2b-white);
    --slds-c-button-text-color-hover: var(--b2b-white);

    /* Card */
    --slds-c-card-color-border: var(--b2b-border-color);
    --slds-c-card-radius-border: var(--b2b-radius-xs);
    --slds-c-card-shadow: none;
}

@media (min-width: 48rem) {
    :root {
        /* Font Sizes */
        --b2b-font-size-h1: 2.5rem;
        --b2b-font-size-h2: 1.75rem;
        --b2b-font-size-h3: 1.45rem;

        /* Spacing */
        --b2b-spacing-3xs: 0.125rem;
        --b2b-spacing-2xs: 0.25rem;
        --b2b-spacing-xs: 0.5rem;
        --b2b-spacing-sm: 0.75rem;
        --b2b-spacing-md: 0.875rem;
        --b2b-spacing-lg: 1rem;
        --b2b-spacing-xl: 1.25rem;
        --b2b-spacing-2xl: 2rem;
        --b2b-spacing-3xl: 3.5rem;
        --b2b-spacing-4xl: 4.5rem;
        --b2b-page-column-gap: 2.25rem;

        /* Tabs */
        --slds-c-tabs-item-spacing-block-end: var(--b2b-spacing-lg);
        --slds-c-tabs-item-spacing-block-start: var(--b2b-spacing-lg);

        /* Modals */
        --slds-c-modal-header-spacing-block-start: var(--b2b-page-column-gap);
    }
}

@media (min-width: 64rem) {
    :root {
        /* Font Sizes */
        --b2b-font-size-h1: 3rem;
        --b2b-font-size-h2: 2rem;
        --b2b-font-size-h3: 1.5rem;
        --b2b-font-size-h4: 1.25rem;
        --b2b-page-column-gap: 2.5rem;
    }
}

@media (prefers-reduced-motion) {
    :root {
        --b2b-mobile-nav-ta11y-duration: 0;
    }
}

/* Global Classes */

.hide-window-overflow {
    overflow: hidden;
}

body {
    background-color: var(--b2b-white);
    font-family: var(--b2b-font-family), sans-serif;
    color: var(--b2b-text-color);
}

.b2b-adjust-inner-icon lightning-primitive-icon {
    display: block;
}

.b2b-section {
    --dxp-c-section-content-spacing-block-end-mobile: var(--b2b-page-padding-block);
    --dxp-c-section-content-spacing-block-start-mobile: var(--b2b-page-padding-block);
    --dxp-c-section-content-spacing-inline-end-mobile: var(--b2b-page-padding-inline);
    --dxp-c-section-content-spacing-inline-start-mobile: var(--b2b-page-padding-inline);
    --dxp-c-section-content-spacing-block-end-tablet: var(--b2b-page-padding-block);
    --dxp-c-section-content-spacing-block-start-tablet: var(--b2b-page-padding-block);
    --dxp-c-section-content-spacing-inline-end-tablet: var(--b2b-page-padding-inline);
    --dxp-c-section-content-spacing-inline-start-tablet: var(--b2b-page-padding-inline);
    --dxp-c-section-content-spacing-block-end: var(--b2b-page-padding-block);
    --dxp-c-section-content-spacing-block-start: var(--b2b-page-padding-block);
    --dxp-c-section-content-spacing-inline-end: var(--b2b-page-padding-inline);
    --dxp-c-section-content-spacing-inline-start: var(--b2b-page-padding-inline);
    padding-block-end: var(--dxp-c-section-content-spacing-block-end);
    padding-block-start: var(--dxp-c-section-content-spacing-block-start);
    padding-inline-end: var(--dxp-c-section-content-spacing-inline-end);
    padding-inline-start: var(--dxp-c-section-content-spacing-inline-start);
}

.b2b-cart-summary-footer {
    border-block-start: 1px solid var(--b2b-text-color);
    display: block;
    margin-block-start: var(--b2b-spacing-2xl);
    padding-block: var(--b2b-spacing-lg);
}

.b2b-max-width {
    margin: 0 auto;
    max-width: var(--b2b-root-max-width);
}

.b2b-empty-message {
    color: var(--b2b-gray-300);
    display: flex;
    justify-content: center;
    padding: var(--b2b-page-column-gap);
    font-size: var(--b2b-font-size-lg);
}

.b2b-global-search-results {
    --slds-c-card-sizing-border: 0;
}

.b2b-global-search-results .slds-table tbody td,
.b2b-global-search-results .slds-table tbody th {
    padding: var(--b2b-spacing-sm) var(--b2b-spacing-xs);
}

.b2b-global-search-results .slds-table thead .slds-th__action {
    padding-block-end: var(--b2b-spacing-sm);
    padding-block-start: var(--b2b-spacing-sm);
    padding-inline-start: var(--b2b-spacing-xs);
    height: auto;
}

.b2b-global-search-results .slds-table tbody th {
    --dxp-c-link-text-decoration: underline;
}

.b2b-global-search-results search_results-navigation,
.b2b-global-search-results search_results-no-results {
    --dxp-crm-search-border-line: 0;
    --dxp-crm-search-box-shadow: none;
}

.b2b-global-search-results .slds-nav-vertical__title,
.b2b-global-search-results .navigation__separator,
.b2b-global-search-results .navigation__filters,
.b2b-global-search-results dxp_crm_search-header-meta,
.b2b-global-search-results search_results-no-results figure {
    display: none;
}

.b2b-global-search-results .slds-nav-vertical__item.slds-is-active .slds-nav-vertical__action:focus {
    box-shadow: none;
    outline: 0;
}

.b2b-global-search-results .slds-nav-vertical__item.slds-is-active .slds-nav-vertical__action:focus-visible {
    outline: 2px solid var(--b2b-wave);
}

c-b2b-quick-actions .b2b-card-border.b2b-quick-order {
    border: 0;
    overflow: visible;
}

/* B2B Card Classes */

.b2b-card-border {
    border-radius: var(--b2b-radius-xs);
    border: 1px solid var(--b2b-border-color);
    background: var(--b2b-white);
    display: block;
    overflow: hidden;
}

.b2b-card-image-left {
    display: grid;
    grid-template-columns: 50% 50%;
}

.b2b-card-content-title {
    font-size: var(--b2b-font-size-h4);
    font-weight: var(--b2b-font-weight-medium);
    margin-block-end: var(--b2b-spacing-lg);
}

.b2b-card {
    --dxp-s-form-element-label-font-size: var(--b2b-font-size-lg);
    --dxp-s-form-element-label-font-weight: var(--b2b-font-weight-medium);
     padding: var(--b2b-spacing-2xl);
}

.b2b-card-content {
    margin-block: var(--b2b-spacing-3xl);
}

.b2b-card footer {
    margin-block-start: var(--b2b-spacing-3xl);
}

.b2b-card-title,
.b2b-card .slds-rich-text-editor__output h2 {
    font-size: var(--b2b-font-size-h4);
    font-weight: var(--b2b-font-weight-medium);
    margin-block-end: var(--b2b-spacing-lg);
}

.b2b-cart-title .textBlock_desktopTabletMobile {
    font-size: var(--b2b-font-size-h4);
    font-weight: var(--b2b-font-weight-medium);
    margin-block-end: var(--b2b-spacing-2xl);
}

.b2b-card-subtitle {
    font-size: var(--b2b-font-size-lg);
    font-weight: var(--b2b-font-weight-medium);
    margin-block-end: var(--b2b-spacing-sm);
}

.b2b-card .slds-rich-text-editor__output h3 {
    font-size: var(--b2b-font-size-lg);
    font-weight: var(--b2b-font-weight-medium);
}

.b2b-card .slds-rich-text-editor__output b,
.b2b-card .slds-rich-text-editor__output strong {
    font-weight: var(--b2b-font-weight-medium);
}

.b2b-card .slds-rich-text-editor__output em {
    font-style: normal;
    font-size: var(--b2b-font-size-sm);
}

.slds-rich-text-editor__output {
    --dxp-c-link-text-decoration: underline;
}

.b2b-card-info {
    [readonly] {
        --slds-c-input-shadow: none;
        cursor: default;
    }
}

.b2b-card-custom {
    --slds-c-card-heading-font-size: var(--b2b-font-size-h4);
    --slds-c-card-heading-font-weight: var(--b2b-font-weight-medium);
    --slds-c-card-header-spacing-block-end: 0;
    --slds-c-card-header-spacing-block-start: var(--b2b-page-column-gap);
    --slds-c-card-header-spacing-inline-end: var(--b2b-page-column-gap);
    --slds-c-card-header-spacing-inline-start: var(--b2b-page-column-gap);
    --slds-c-card-body-spacing-block-end: var(--b2b-page-column-gap);
    --slds-c-card-body-spacing-block-start: var(--b2b-page-column-gap);
    --slds-c-card-body-spacing-inline-end: var(--b2b-page-column-gap);
    --slds-c-card-body-spacing-inline-start: var(--b2b-page-column-gap);
    --slds-c-card-color-background: var(--b2b-white);
    --slds-c-card-color-border: var(--b2b-border-color);
    --slds-c-card-radius-border: var(--b2b-radius-xs);
    --slds-c-card-shadow: none;
}

/* Cart Overrides */

.b2b-cart-summary dl {
    border-top: 1px solid var(--b2b-border-color);
    border-bottom: 1px solid var(--b2b-border-color);
    padding-block: 1.25rem;
}

.b2b-cart-heading {
    --dxp-s-text-heading-medium-font-size: var(--b2b-font-size-h3);
    --dxp-s-body-font-weight: var(--b2b-font-weight-medium);
}

.b2b-cart-subtotal-heading .subtotal-price.item {
    --dxp-s-body-font-size: var(--b2b-font-size-h3);
    --dxp-s-body-font-weight: var(--b2b-font-weight-medium);
    --com-c-cart-summary-subtotal-text-size: var(--b2b-font-size-h3);
    font-weight: var(--b2b-font-weight-medium);
}

.b2b-cart-subtotal-heading .total-price.item {
    display: none;
}

.b2b-section-header {
    border-block-end: 1px solid var(--b2b-border-color);
    display: flex;
    margin-block-end: var(--b2b-spacing-2xl);
    padding-block: var(--b2b-spacing-sm);
}

.b2b-section-header-text {
    flex: 1;
    font-size: var(--b2b-font-size-h3);
    font-weight: var(--b2b-font-weight-medium);
}

.b2b-chevron-link {
    --dxp-c-link-text-decoration: underline;
    align-items: center;
    display: inline-flex;
    gap: 1rem;
    font-size: var(--b2b-font-size-md);
    font-weight: var(--b2b-font-weight-medium);
    line-height: 1;
    text-decoration: var(--dxp-c-link-text-decoration);
}

/*
  Inverse Button Styles do not work with DXP button size classes.
  Add this class to those buttons to maintain size.
 */
.b2b-button-inverse {
    --slds-c-button-outline-brand-color-background: transparent;
    --slds-c-button-outline-brand-color-border: var(--b2b-white);
    --sds-c-button-text-color: var(--b2b-white);
    --slds-c-button-outline-brand-color-border-hover: var(--b2b-white);
    --slds-c-button-outline-brand-color-background-hover: var(--b2b-white);
    --slds-c-button-text-color-hover: var(--b2b-gray-500);
}

.b2b-button-outline-destructive {
    --slds-c-button-outline-brand-color-border: var(--b2b-sunset-400);
    --slds-c-button-text-color: var(--b2b-sunset-400);
    --slds-c-button-outline-brand-color-background-hover: var(--b2b-sunset-400);
    --slds-c-button-outline-brand-color-border-hover: var(--b2b-sunset-400);
    --slds-c-button-outline-brand-color-background-active: var(--b2b-sunset-400);
    --slds-c-button-outline-brand-color-border-active: var(--b2b-sunset-400);
}

.b2b-checkbox-flex {
    display: flex;
}

.b2b-checkbox-label > span {
    flex: 1;
}

.b2b-rich-text p {
    margin: 0.35rem 0;
}

.b2b-address-list {
    --com-c-my-account-address-card-border-radius: var(--b2b-radius-xs);
    --com-c-my-account-address-card-border-color: currentColor;
    --com-c-my-account-address-card-text-color: var(--b2b-text-color);
    --com-c-my-account-address-card-padding-vertical: 1.125rem;
    --com-c-my-account-address-card-padding-horizontal: 1.125rem;
}

.b2b-address-list commerce_my_account-my-account-address-footer {
    display: none;
}

.b2b-address-list div.address-grid-gap-small {
    padding: 0;
}

@media (min-width: 64rem) {
    .b2b-address-list div.address-container {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* SLDS Button */

.slds-button+.slds-button {
    margin-left: var(--b2b-spacing-xs);
}

/* SLDS Vertical Nav Overrides */

.slds-nav-vertical__item {
    padding: 0;
}

.slds-nav-vertical__item .slds-nav-vertical__action {
    padding: var(--b2b-spacing-md) var(--b2b-spacing-lg);
}

.slds-nav-vertical__item.slds-is-active {
    border-left: 0.125rem solid var(--b2b-gray-500);
}

.slds-nav-vertical__item:hover::before,
.slds-nav-vertical__item.slds-is-active::before {
    background: var(--b2b-gray-100);
}

.slds-nav-vertical__item.slds-is-active .slds-nav-vertical__action,
.slds-nav-vertical__action:hover {
    box-shadow: none;
}

.slds-nav-vertical__item.slds-is-active .slds-nav-vertical__action:focus {
    box-shadow: inset 4px 0 0 var(--b2b-wave-light);
    outline: 2px solid var(--b2b-wave-light);
}

/* SLDS Accordion Overrides */

.slds-button.slds-accordion__summary-action {
    --dxp-s-button-font-size: 2rem;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    padding: var(--b2b-spacing-lg) 0;
    border-top: 1px solid var(--b2b-border-color);
    border-radius: 0;
}

.slds-button.slds-accordion__summary-action .slds-accordion__summary-content {
    font-size: var(--b2b-font-size-lg);
}

/* SLDS Input Overrides */

.slds-input__icon .slds-button_icon,
.slds-input__icon .slds-icon {
    --slds-c-button-spacing-block-end: 0;
    --slds-c-button-spacing-block-start: 0;
    display: block;
}

.slds-radio .slds-radio_faux {
    border-width: 0.125rem;
    width: 2rem;
    height: 2rem;
}

.slds-radio [type=radio]:checked + .slds-radio_faux:after,
.slds-radio [type=radio]:checked ~ .slds-radio_faux:after,
.slds-radio [type=radio]:checked + .slds-radio__label .slds-radio_faux:after,
.b2b-checked .slds-radio .slds-radio_faux:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    border-radius: 50%;
    background-color: var(--sds-c-radio-mark-color-foreground, var(--dxp-s-form-element-color-foreground, var(--dxp-g-brand-1)));
    width: 1.325rem;
    height: 1.325rem;
}

lightning-radio-group .slds-radio {
    padding: var(--b2b-spacing-xl);
}

lightning-radio-group .slds-radio [type=radio]+.slds-radio__label .slds-radio_faux {
    margin-right: var(--b2b-spacing-xl);
}

.slds-checkbox .slds-checkbox_faux {
    margin-top: 0.2rem;
    width: 1.5rem;
    height: 1.5rem;
}

.slds-checkbox [type=checkbox]:checked+.slds-checkbox__label .slds-checkbox_faux:after,
.slds-checkbox [type=checkbox]:checked+.slds-checkbox_faux:after,
.slds-checkbox [type=checkbox]:checked~.slds-checkbox_faux:after {
    height: .45em;
    width: .8em;
    margin-block-start: -0.115em;
}

.slds-checkbox [type=checkbox]:disabled + .slds-checkbox__label .slds-checkbox_faux {
    opacity: 0.5;
    cursor: not-allowed;
}

.slds-input[readonly] {
    font-size: var(--dxp-c-input-text-font-size, var(--dxp-s-form-element-text-font-size, var(--dxp-s-body-font-size)));
}

.slds-form-element__label {
    margin-bottom: var(--b2b-spacing-xs);
}

.slds-select {
    /* Normalize height of lightning-select with other inputs */
    min-height: calc(2.5rem + (1px * 2));
}

.slds-form-element_address lightning-picklist {
    /* remove doubled margins in address forms */
    margin-block-end: 0;
}

.flowruntime-inline-container {
    align-items: baseline;
    gap: 0.5em;
}

/* Remove date format message from date input that causes form bouncing. */
lightning-datepicker .slds-dropdown-trigger + .slds-form-element__help {
    position: absolute !important;
    margin: -1px !important;
    border: 0 !important;
    padding: 0 !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    text-transform: none !important;
    white-space: nowrap !important;
}

/* SLDS Toasts/Notifications */

.slds-notify {
    --dxp-g-success-contrast: var(--b2b-text-color);
    --dxp-g-success: var(--b2b-white);
    --dxp-g-neutral-contrast: var(--b2b-text-color);
    --dxp-g-neutral: var(--b2b-white);
    --dxp-g-destructive-contrast: var(--b2b-text-color);
    --dxp-g-destructive: var(--b2b-sunset-100);
    --dxp-s-body-font-family: var(--b2b-font-family);
    --dxp-s-body-font-size: var(--b2b-font-size-sm);
    border: 1px solid var(--b2b-gray-200);
    box-shadow: var(--b2b-card-shadow);
}

.slds-notify .slds-notify__content {
    font-size: var(--dxp-s-body-font-size);
}

.slds-notify .slds-text-heading_small {
    --dxp-s-body-font-size: 1.125rem;
    --dxp-s-body-font-weight: var(--b2b-font-weight-medium);
}

.slds-notify .slds-icon {
    --dxp-g-neutral-contrast: var(--b2b-text-color);
}

.slds-theme_success.slds-notify .slds-icon {
    --dxp-g-success-contrast: var(--b2b-success);
}

.slds-theme_error.slds-notify {
    border: 1px solid var(--b2b-destructive);
}

.slds-theme_error.slds-notify .slds-icon {
    --dxp-g-destructive-contrast: var(--b2b-destructive);
}

/* Checkout Notification */
.notification-container {
    --dxp-g-destructive-contrast: var(--b2b-text-color);
    --dxp-g-destructive: var(--b2b-sunset-100);
    align-items: baseline !important;
    border: 1px solid var(--b2b-gray-200);
    border-radius: var(--slds-c-toast-radius-border);
    box-shadow: var(--b2b-card-shadow);
    padding-block-end: var(--slds-c-toast-spacing-block-end);
    padding-block-start: var(--slds-c-toast-spacing-block-start);
    padding-inline-end: var(--slds-c-toast-spacing-inline-end);
    padding-inline-start: var(--slds-c-toast-spacing-inline-start);
    margin-block-end: var(--b2b-spacing-lg);
}

.notification-container.slds-theme_error {
    --dxp-g-root: var(--b2b-text-color);
    border: 1px solid var(--b2b-destructive);
}

/* SLDS Tabs Overrides */

.slds-tabs_default__nav {
    column-gap: var(--b2b-spacing-lg);
}

.slds-tabs_default .slds-tabs_default__item {
    font-size: var(--b2b-font-size-md);
}

.slds-tabs_default__item .slds-tabs_default__link {
    --dxp-s-link-text-color: var(--b2b-gray-400);
    font-weight: var(--b2b-font-weight);
}

.slds-tabs_default__item.slds-is-active .slds-tabs_default__link {
    --dxp-s-link-text-color: var(--b2b-text-color);
    font-weight: var(--b2b-font-weight);
}

.b2b-remove-overflow-tab {
    .slds-tabs_default__overflow-button {
        display: none;
    }
}

@media (min-width: 48rem) {
    .slds-tabs_default__nav {
        column-gap: var(--b2b-spacing-xl);
    }

    .slds-tabs_default .slds-tabs_default__item {
        font-size: var(--b2b-font-size-lg);
    }
}

/* Splide Sonos Theme */

.product-image-carousel .splide__pagination__page {
    background-color: var(--b2b-gray-200);
    height: 1rem;
    width: 1rem;
    margin: calc(var(--b2b-spacing-md, 1rem) / 2);
    opacity: 1;
    transition: background-color 0.25s linear;
}

.product-image-carousel .splide__pagination__page:hover,
.product-image-carousel .splide__pagination__page.is-active {
    background-color: var(--b2b-gray-500);
    transform: unset;
}

.splide__arrow .slds-current-color  svg {
    fill: currentColor;
    height: 1em;
    width: 1em;
}

button.splide__arrow {
    border: 0;
}

/* OOTB Component Overrides */

community_login-login-form .slds-border_top {
    border: 0;
}

.b2b-nav-list h2 {
    display: none;
}

.b2b-nav-list .comm-login-form__container .slds-border_top {
    --slds-g-color-border-base-1: transparent;
}

.b2b-nav-list .comm-login-form__link-section {
    font-size: var(--b2b-font-size-sm);
}

/* SLDS Modals */

.slds-backdrop_open {
    backdrop-filter: blur(3px);
}

lightning-modal-base .slds-modal__content.slds-p-around_medium {
    padding-block-start: var(--b2b-spacing-2xl);
    padding-block-end: var(--b2b-page-column-gap);
    padding-inline: var(--b2b-page-column-gap);
}

lightning-modal-base .slds-modal__close {
    bottom: 0;
    right: 0;
    text-align: right;
    transform: translate(calc(var(--b2b-page-column-gap) * -1), var(--b2b-spacing-4xl));
    z-index: 1;
}

lightning-modal-base .slds-modal__close .slds-button_icon {
    color: var(--b2b-gray-300);
    padding: 0.375rem;
}

lightning-modal-base .slds-modal__close .slds-button_icon:hover {
    color: var(--b2b-gray-500);
}

.slds-modal__header {
    text-align: start;
}

.slds-modal__footer .slds-button+.slds-button {
    margin-left: var(--b2b-spacing-xl);
}

@media (min-width: 48em) {
    .slds-modal_full .slds-modal__container {
        max-width: var(--b2b-root-max-width);
    }
}

/* Flow Styles */
lightning-flow,
dxp_flow-flow {
    .flowruntimeBody__lwc,
    .flowruntimeBody {
        margin: 0;
        padding: 0;
    }

    .slds-card__footer.navigationBar {
        border-top: 0;
    }
}

/* Account Side Nav Overrides */
@media (min-width: 48rem) {
    .b2b-nav-list .comm-login-form__container .slds-button_stretch,
    .b2b-nav-list .comm-check-email .slds-button_stretch {
        width: auto;
    }

    .b2b-nav-list .comm-check-email__title,
    .b2b-nav-list .comm-forgot-password__title {
        margin: 0 auto;
        max-width: 25rem;
        min-width: 18rem;
    }

    .b2b-nav-list .comm-check-email__title.slds-text-align_center,
    .b2b-nav-list .comm-forgot-password__title.slds-text-align_center {
        text-align: left;
    }
}

@media print {
    .slds-button {
        display: none;
    }

    community_layout-column {
        width: 100%;
    }
}


@layer view-transitions {
    .nav-list {
        view-transition-name: mobileNav;
    }

    @layer open-modal {
        @keyframes animate-in {
            0% {
                transform: translateX(-100%);
            }
            100% {
                transform: translateX(0);
            }
        }

        ::view-transition-new(mobileNav):only-child {
            animation-name: animate-in;
            animation-duration: var(--b2b-mobile-nav-ta11y-duration);
            animation-timing-function: cubic-bezier(1, -0.62, 0.61, 1.37);
        }
    }

    @layer close-modal {
        @keyframes animate-out {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(-100%);
            }
        }

        ::view-transition-old(mobileNav):only-child {
            animation-name: animate-out;
            animation-duration: var(--b2b-mobile-nav-ta11y-duration);
            animation-timing-function: ease-in-out;
        }
    }
}