/* Dealer Connect shared styles. Welcome, Opportunities and Ordering load this single resource.
 * Baseline: current Splash Dealer Welcome branding and published Salesforce Commerce theme, API 67.0.
 * Site-specific behavior stays in the site's CSS. CMS asset references stay in their owning environment.
 */

/* Platform Commerce presentation, shared by the three LWR templates. */
:root {
  --com-c-theme-version: 1;
  --com-c-header-zindex: 999;
  /*
      Subscription history panel z-index should be greater than header z-index
      as Subscription panel should be on top header panel.
  */
  --com-c-subscription-history-panel-zindex: 1000;
}

commerce_my_account-my-account-layout aside.navigation {
  padding-top: var(--dxp-g-spacing-xlarge);
}

b2c_lite_commerce-external-layout b2c_lite_commerce-store-logo-cms img {
  padding-top: var(--dxp-g-spacing-xlarge);
  padding-bottom: var(--dxp-g-spacing-xlarge);
}

b2b_buyer_product_details-expandable-text-section {
  --sds-c-accordion-section-spacing-inline-start: 0;
}

b2c_lite_commerce-my-account-profile,
b2c_lite_commerce-my-account-password {
  --dxp-g-spacing-medium: 0;
}

b2c_lite_commerce-my-account-profile,
b2c_lite_commerce-my-account-password,
commerce-my-account-profile,
commerce-my-account-password {
  --sds-c-card-header-spacing-block-start: 1rem;
  --sds-c-card-header-spacing-inline-end: 1rem;
  --sds-c-card-header-spacing-inline-start: 1rem;
  --sds-c-card-body-spacing-inline-start: 1rem;
  --sds-c-card-body-spacing-inline-end: 1rem;
  --sds-c-card-body-spacing-block-end: 1rem;
  --sds-c-card-radius-border: 0;
}
b2c_lite_commerce-my-account-profile label,
b2c_lite_commerce-my-account-password label,
commerce-my-account-profile label,
commerce-my-account-password label {
  --dxp-s-form-element-label-font-size: var(--dxp-g-font-size-4);
  font-weight: var(--dxp-c-strong-text-weight);
}

b2c_lite_commerce-my-account-password header,
commerce-my-account-password header {
  font-size: var(--dxp-g-font-size-4);
}

@media (min-width: 64.0625em) {
  b2c_lite_commerce-my-account-profile,
  b2c_lite_commerce-my-account-password,
  commerce-my-account-profile,
  commerce-my-account-password {
    --sds-c-card-header-spacing-block-start: 2rem;
    --sds-c-card-header-spacing-inline-end: 2rem;
    --sds-c-card-header-spacing-inline-start: 2rem;
    --sds-c-card-body-spacing-block: 1rem;
    --sds-c-card-body-spacing-inline-start: 2rem;
    --sds-c-card-body-spacing-inline-end: 2rem;
    --sds-c-card-body-spacing-block-end: 2rem;
  }
}
b2c_lite_commerce-scoped-notification .slds-scoped-notification,
commerce-scoped-notification .slds-scoped-notification {
  margin-bottom: 1rem;
}

b2c_lite_commerce-my-account-menu-ui .slds-dropdown__header {
  font-size: var(--dxp-g-font-size-6);
}
b2c_lite_commerce-my-account-menu-ui lightning-menu-subheader {
  border-bottom: 1px solid var(--dxp-g-root-1);
}

commerce_builder-order-confirmation-error-message .slds-icon,
commerce_builder-order-confirmation-error-message lightning-icon::part(icon) {
  width: 4rem;
  height: 4rem;
  fill: var(--com-c-order-confirmation-error-icon-color, #707275);
}

/* Required to override cart items css in order confirmation items*/
commerce_builder-order-confirmation-items ul article li.li-layout {
  border-bottom: none;
  padding: 0.75rem 0 0.25rem 0 !important;
}

commerce_builder-order-confirmation-items ul article:last-child li.li-layout {
  border-bottom: none;
  padding: 0.75rem 0 0 0 !important;
}

commerce_builder-order-confirmation-items ul {
  padding-bottom: 0rem !important;
}

commerce-subscription-card commerce-pill .slds-pill__label {
  white-space: normal;
  word-break: break-all;
}

/* Theme changes for product configurator modal */
runtime_industries_cfg-pricing-summary-option .optionName .slds-truncate {
  max-width: 100%;
}

runtime_industries_cfg-pricing-summary-pane .detailHeader {
  padding: 1rem;
}

runtime_industries_cfg-pricing-summary .totalsSection {
  --footerHeight: var(--lwc-spacingXxLarge, 3.5rem);
}

runtime_industries_cfg-action-footer .spacer-element .slds-docked-form-footer {
  --componentHeight: 4.5rem;
  padding-bottom: 1rem;
}

runtime_industries_cfg-transaction-header,
runtime_industries_cfg-favorite-container,
runtime_industries_cfg-product-header .psm-option-value,
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.monthlyTotal),
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.annualTotal),
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.quarterlyTotal),
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.semiAnnualTotal),
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.defaultNetAmount) {
  display: none;
}

/* disabled checkbox will be greyed out */
.slds-checkbox [type=checkbox]:disabled + .slds-checkbox--faux,
.slds-checkbox [type=checkbox]:disabled + .slds-checkbox_faux,
.slds-checkbox [type=checkbox]:disabled ~ .slds-checkbox--faux,
.slds-checkbox [type=checkbox]:disabled ~ .slds-checkbox_faux,
.slds-checkbox [type=checkbox]:disabled + .slds-checkbox__label .slds-checkbox--faux,
.slds-checkbox [type=checkbox]:disabled + .slds-checkbox__label .slds-checkbox_faux {
  background-color: var(--com-c-disabled-checkbox-bg-color, #ecebea);
  border-color: var(--com-c-disabled-checkbox-border-color, #c9c7c5);
}

.slds-checkbox [type=checkbox]:disabled + .slds-checkbox--faux::after,
.slds-checkbox [type=checkbox]:disabled + .slds-checkbox_faux::after,
.slds-checkbox [type=checkbox]:disabled ~ .slds-checkbox--faux::after,
.slds-checkbox [type=checkbox]:disabled ~ .slds-checkbox_faux::after,
.slds-checkbox [type=checkbox]:disabled + .slds-checkbox__label .slds-checkbox--faux::after,
.slds-checkbox [type=checkbox]:disabled + .slds-checkbox__label .slds-checkbox_faux::after {
  border-color: var(--com-c-disabled-checkbox-check-color, #c9c7c5);
}

runtime_industries_cfg-config-header .header-banner-spacer {
  --banner-height: 6rem;
}

runtime_industries_cfg-pricing-summary-option .slds-col.slds-text-align_start {
  text-align: start;
}

:root {
    --com-c-theme-version: 2;
    --com-c-text-color-weak: #7c7e81;
    --com-c-dropdown-button-sizing-border: 0px;
    --com-c-dropdown-button-shadow-focus: none;
    --com-c-dropdown-text-decoration: none;
    --com-c-dropdown-button-text-decoration-active: none;
    --com-c-dropdown-button-text-decoration: none;
    --com-c-number-input-border-radius: 50%;
    --com-c-number-input-shadow: none;
    --com-c-number-input-width-border: 1px;
    --com-c-button-icon-color-disabled: #d9dfe7;
    --com-c-layout-header-border-bottom: 0.065rem solid #d9dfe7;
    /* linking these two hooks to make consistency when border-radius changes to different value */
    --dxp-c-navigation-list-border-radius: var(--com-c-dropdown-border-radius, 6px);

    /* variable for form input element min height */
    --var-form-input-element-min-height: 54px;

    --com-c-header-zindex: 999;
    /*
        Subscription history panel z-index should be greater than header z-index
        as Subscription panel should be on top header panel.
    */
    --com-c-subscription-history-panel-zindex: 1000;
}

a.slds-button:not(:is(.slds-button_outline-brand, .slds-button_brand, .slds-button_neutral)),
button.slds-button:not(:is(.slds-button_outline-brand, .slds-button_brand, .slds-button_neutral)),
a.slds-button:not(:is(.slds-button_outline-brand, .slds-button_brand, .slds-button_neutral)):is(
        :active,
        :focus,
        :hover
    ),
button.slds-button:not(:is(.slds-button_outline-brand, .slds-button_brand, .slds-button_neutral)):is(
        :active,
        :focus,
        :hover
    ),
lightning-button-menu.no-border-button::part(button),
lightning-button-menu.no-border-button::part(button):is(:active, :focus, :hover) {
    text-decoration: underline;
}

/* Dropdown styles for mobile view*/
.slds-select, /* Backward compatible old override */
lightning-select::part(select) {
    /* Native shadow DOM compatible */
    --sds-c-select-color-border: var(--dxp-s-form-element-color-border);
}

b2b_buyer_product_details-expandable-text-section {
    --sds-c-accordion-section-spacing-inline-start: 0;
}

/* DEPRECATED Component still we need to support styling as per new theme*/
/* My Account Profile and Password styles start */
commerce-my-account-profile,
commerce-my-account-password {
    --sds-c-card-header-spacing-block-start: 1.5rem;
    --sds-c-card-header-spacing-inline-end: 1.5rem;
    --sds-c-card-header-spacing-inline-start: 1.5rem;
    --sds-c-card-body-spacing-inline-start: 1.5rem;
    --sds-c-card-body-spacing-inline-end: 1.5rem;
    --sds-c-card-body-spacing-block-end: 1.5rem;
    --sds-c-card-radius-border: 0;
}

commerce-my-account-profile label,
commerce-my-account-password label {
    --dxp-s-form-element-label-font-size: var(--dxp-g-font-size-4);
    font-weight: var(--dxp-c-strong-text-weight);
}

commerce-my-account-password lightning-card header[part='header'],
commerce-my-account-profile lightning-card header[part='header'] {
    padding-left: var(--dxp-s-form-element-spacing-horizontal-start);
}

commerce-my-account-password header {
    font-size: var(--dxp-g-font-size-4);
}

commerce-my-account-profile lightning-input.slds-form-element[readonly] div[part='input-text']:focus-within,
commerce-my-account-password lightning-input.slds-form-element[readonly] div[part='input-text']:focus-within,
commerce-my-account-profile lightning-input.slds-form-element[readonly] div[part='input-text'],
commerce-my-account-password lightning-input.slds-form-element[readonly] div[part='input-text'] {
    border: 0;
    pointer-events: none;
}

commerce-my-account-profile lightning-input.slds-form-element.slds-has-error div[part='input-text'],
commerce-my-account-password lightning-input.slds-form-element.slds-has-error div[part='input-text'] {
    border: 0;
    border-bottom: 2px solid var(--dxp-g-destructive);
    box-shadow: none;
}

commerce-my-account-profile lightning-input.slds-form-element div[part='input-text'],
commerce-my-account-password lightning-input.slds-form-element div[part='input-text'] {
    border-radius: 0;
    border: 0;
    border-bottom: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border);
}

commerce-my-account-profile lightning-input.slds-form-element.slds-has-error .slds-input:not(:focus-within),
commerce-my-account-password lightning-input.slds-form-element.slds-has-error .slds-input:not(:focus-within),
commerce-my-account-profile lightning-input.slds-form-element .slds-input,
commerce-my-account-password lightning-input.slds-form-element .slds-input,
commerce-my-account-profile lightning-input.slds-form-element div[part='input-container'],
commerce-my-account-password lightning-input.slds-form-element div[part='input-container'] {
    border-radius: 0;
    height: 100%;
}

commerce-my-account-profile lightning-input.slds-form-element[readonly] .slds-input,
commerce-my-account-password lightning-input.slds-form-element[readonly] .slds-input {
    padding-left: var(--dxp-s-form-element-spacing-horizontal-start);
}

commerce-my-account-profile lightning-input.slds-form-element .slds-input,
commerce-my-account-password lightning-input.slds-form-element .slds-input {
    padding-left: calc(var(--dxp-s-form-element-spacing-horizontal-start) + 2px);
}

commerce-my-account-profile lightning-input.slds-form-element div[part='input-text']:focus-within,
commerce-my-account-password lightning-input.slds-form-element div[part='input-text']:focus-within {
    border: 0;
    border-bottom: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border-focus);
}

commerce-my-account-profile
    commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-combobox_container {
    border-radius: 0;
    border-left: none;
    border-top: none;
}

commerce-my-account-profile
    commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-input,
commerce-my-account-profile
    commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    div[part='input-text'] {
    border-radius: 0;
}
/* My Account Profile and Password styles end */


/* OrderTotals component styles for CGX */
commerce_my_account-order-totals .totals-card.slds-card {
    border-color: var(--com-c-order-totals-custom-border-color, var(--com-c-order-totals-border-color, #d9dfe7));
    box-shadow: none;
}

commerce_my_account-order-totals .totals-card .field-item {
    --com-c-order-totals-font-size: var(--com-c-order-totals-custom-font-size, var(--dxp-s-body-font-size));
}

commerce_my_account-order-totals .totals-card .field-item lightning-formatted-rich-text,
commerce_my_account-order-totals .totals-card .field-item commerce-field-display {
    --com-c-order-totals-text-decoration: var(
        --com-c-order-totals-custom-text-decoration,
        var(--dxp-s-body-text-decoration)
    );
}

commerce_my_account-order-totals .discount-content {
    --com-c-order-discounts-color: var(--com-c-order-discounts-custom-color, #707275);
}

commerce_my_account-order-totals .totals-card.slds-card {
    padding: 16px;
}

commerce_my_account-order-totals .totals-card.slds-card .field-item:not(:last-child),
commerce_my_account-order-totals .totals-card.slds-card header h2 {
    margin-bottom: 8px;
}

commerce_my_account-order-totals .totals-card.slds-card header,
commerce_my_account-order-totals .totals-card.slds-card dl:not(.order-discount) {
    margin: 0px;
    padding: 0px;
}

commerce_my_account-order-totals .totals-card.slds-card .field-item:last-child {
    margin-bottom: 0px;
}

commerce_my_account-order-totals .order-discount {
    padding-top: 8px;
}
/* OrderTotals component styles for CGX ends */


/* DEPRECATED Component lightning-vertical-navigation-item is not used in v2 component*/
/** My Account navigation menu cgx styles **/

aside.navigation {
    padding-top: var(--dxp-g-spacing-large);
    padding-bottom: var(--dxp-g-spacing-large);
}

aside.navigation lightning-vertical-navigation-item.slds-nav-vertical__item.slds-is-active:before,
aside.navigation lightning-vertical-navigation-item.slds-nav-vertical__item:hover:before {
    background-color: #f7f9fa;
}

aside.navigation lightning-vertical-navigation-item.slds-nav-vertical__item.slds-is-active .slds-nav-vertical__action,
aside.navigation lightning-vertical-navigation-item.slds-nav-vertical__item .slds-nav-vertical__action:hover,
aside.navigation lightning-vertical-navigation-item.slds-nav-vertical__item:focus-within::before {
    box-shadow: none;
}

aside.navigation lightning-vertical-navigation-item.slds-nav-vertical__item a {
    text-decoration: none;
}

aside.navigation
    lightning-vertical-navigation-item.slds-nav-vertical__item
    a:link:not(.slds-button, .slds-dropdown__item > a),
aside.navigation
    lightning-vertical-navigation-item.slds-nav-vertical__item
    a:visited:not(.slds-button, .slds-dropdown__item > a) {
    text-decoration: none;
}

aside.navigation lightning-vertical-navigation-item.slds-nav-vertical__item a {
    font-size: 1rem;
    color: var(--dxp-c-text-block-text-color, var(--dxp-g-root-contrast, #1c1c1c));
}

/** My Account navigation menu cgx styles ends **/


/* My Account navigation menu v2 styles start */

@media (min-width: 64.0625em) {
    commerce_builder-navigation-menu-item-list .my-account-nav-menu li.slds-nav-vertical__item a.slds-nav-vertical__action {
        padding-left: 3.5rem;
    }
}

commerce_builder-navigation-menu-item-list .my-account-nav-menu li.slds-nav-vertical__item.slds-is-active:before,
commerce_builder-navigation-menu-item-list .my-account-nav-menu li.slds-nav-vertical__item:hover:before {
    background-color: var(--com-c-my-account-nav-menu-item-bg-color, #f7f9fa);
}

commerce_builder-navigation-menu-item-list .my-account-nav-menu li.slds-nav-vertical__item.slds-is-active .slds-nav-vertical__action,
commerce_builder-navigation-menu-item-list .my-account-nav-menu li.slds-nav-vertical__item .slds-nav-vertical__action:hover,
commerce_builder-navigation-menu-item-list .my-account-nav-menu li.slds-nav-vertical__item:focus-within::before {
    box-shadow: none;
}

commerce_builder-navigation-menu-item-list .my-account-nav-menu li.slds-nav-vertical__item a {
    text-decoration: none;
    font-size: 1rem;
    color: var(--dxp-c-text-block-text-color, var(--dxp-g-root-contrast, #1c1c1c));
}

/* My Account navigation menu v2 styles end */

@media (min-width: 64.0625em) {
    commerce-my-account-profile,
    commerce-my-account-password {
        --sds-c-card-body-spacing-block: 1rem;
    }

    /* css for My Account Navigation menu CGX  designs specific to desktop */

    aside.navigation {
        padding-top: var(--dxp-g-spacing-xlarge);
        padding-bottom: var(--dxp-g-spacing-xlarge);
    }

    aside.navigation .navigationCtn .welcomeMessageCtn {
        padding-left: 3.5rem;
    }

    aside.navigation lightning-vertical-navigation-item .slds-nav-vertical__action {
        padding: 1rem 0rem 1rem 3.5rem;
    }

    /* Navigation Menu styles ends */
}


/* Order Confirmation Styles Start*/
commerce_builder-order-confirmation-error-message .slds-icon,
commerce_builder-order-confirmation-error-message lightning-icon::part(icon) {
    width: 4rem;
    height: 4rem;
    fill: var(--com-c-order-confirmation-error-icon-color, #707275);
}

/* Required to override cart items css in order confirmation items*/
commerce_builder-order-confirmation-items ul article li.li-layout {
    border-bottom: none;
    padding: 0.75rem 0 0.25rem 0 !important;
}

commerce_builder-order-confirmation-items ul article:last-child li.li-layout {
    border-bottom: none;
    padding: 0.75rem 0 0 0 !important;
}

commerce_builder-order-confirmation-items ul {
    padding-bottom: 0rem !important;
}

/* Order Confirmation Styles End*/


/* Commerce dropdown styles start */   
.slds-dropdown, /* Backward compatible old override */
lightning-button-menu::part(dropdown) /* Native shadow DOM compatible */ {
    border-radius: var(--com-c-dropdown-border-radius, 6px);
}

commerce-dropdown button.slds-button, /* Backward compatible old override */
commerce-dropdown button.slds-button:active,
commerce-dropdown button.slds-button:focus,
commerce-dropdown button.slds-button:hover,
commerce-dropdown lightning-button-menu::part(button), /* Native shadow DOM compatible */
commerce-dropdown lightning-button-menu::part(button):active,
commerce-dropdown lightning-button-menu::part(button):focus,
commerce-dropdown lightning-button-menu::part(button):hover {
    text-decoration: var(--com-c-dropdown-button-text-decoration, none);
}

commerce-dropdown button.slds-button:focus-visible {
    /* Follows the Theme's Tertiary Button Focus State color */
    outline: 2px solid var(--dxp-s-tertiary-button-text-color-focus, var(--dxp-g-brand-1, var(--dxp-g-root-contrast)));
    outline-offset: 2px;
}
/* Commerce dropdown styles end */  


/* Subscription card styles start */
commerce-subscription-card commerce-dropdown button.slds-button,
commerce-subscription-card commerce-dropdown button.slds-button:active,
commerce-subscription-card commerce-dropdown button.slds-button:focus,
commerce-subscription-card commerce-dropdown button.slds-button:hover {
    text-decoration: var(--com-c-dropdown-button-text-decoration, none) !important;
}

/* Native shadow DOM compatible */
commerce-subscription-card commerce-dropdown lightning-button-menu::part(button),
commerce-subscription-card commerce-dropdown lightning-button-menu::part(button):active,
commerce-subscription-card commerce-dropdown lightning-button-menu::part(button):focus,
commerce-subscription-card commerce-dropdown lightning-button-menu::part(button):hover {
    text-decoration: var(--com-c-dropdown-button-text-decoration, none) !important;
}

commerce-subscription-card commerce-pill .slds-pill__label {
    white-space: normal;
    word-break: break-all;
}
/* Subscription card styles end */


commerce_builder-order-products-info {
    --com-c-order-products-separator-color: #d9dfe7;
}

b2c_lite_commerce-scoped-notification .slds-scoped-notification,
commerce-scoped-notification .slds-scoped-notification {
    margin-bottom: 1rem;
}

/*
 * =========================
 * For form input new design
 * =========================
 */

 lightning-input label.slds-form-element__label, /* Backward compatible old override */
 lightning-combobox label.slds-form-element__label,
 lightning-combobox::part(label), /* Native shadow DOM compatible */
 lightning-input::part(label) {
     cursor: text;
     position: absolute;
     font-size: var(--dxp-s-body-font-size);
     font-weight: var(--dxp-s-body-font-weight);
     transition: ease all 0.2s;
     z-index: 1;
     padding: 0;
     left: 12px;
 }
 
 /*Required flag color*/
 abbr.slds-required, /* Backward compatible old override */
 lightning-select::part(required), /* Native shadow DOM compatible */
 lightning-radio-group::part(required),
 lightning-combobox::part(required),
 lightning-input::part(required) {
     color: var(--dxp-s-form-element-label-color);
 }
 
 /*for input boxes*/
 lightning-input.slds-form-element.slds-has-error div[part="input-text"], /* Backward compatible old override */
 lightning-input.slds-form-element[invalid] div[part="input-text"],
 lightning-lookup-address.slds-form-element.slds-has-error div[part="input-text"],
 lightning-lookup-address.slds-form-element[invalid] div[part="input-text"],
 lightning-input.slds-form-element.slds-has-error::part(input-text), /* Native shadow DOM compatible */
 lightning-input.slds-form-element[invalid]::part(input-text) {
     border: calc(var(--dxp-s-form-element-width-border) + 1px) solid var(--dxp-g-destructive);
 }
 
 lightning-input.slds-form-element.slds-has-error .slds-input:not(:focus-within), /* Backward compatible old override */
 lightning-lookup-address.slds-form-element.slds-has-error .slds-input:not(:focus-within),
 lightning-input.slds-form-element.slds-has-error::part(input):not(:focus-within) /* Native shadow DOM compatible */ {
     padding-bottom: calc(var(--dxp-s-form-element-spacing-block-end) - 2px);
     border-radius: calc(var(--dxp-s-form-element-radius-border) - var(--dxp-s-form-element-width-border));
 }
 
  /*
   * Input forms in commerce storefronts have the labels inside the input so we need to hide the error icon
   * as it is overlapping with the label.
   */
  lightning-input.slds-form-element.slds-has-error svg[part="icon"] {
     display: none;
 }
 
 lightning-input.slds-form-element div[part="input-text"], /* Backward compatible old override */
 lightning-lookup-address.slds-form-element div[part="input-text"],
 lightning-input.slds-form-element::part(input-text) /* Native shadow DOM compatible */ {
     min-height: var(--var-form-input-element-min-height, 54px);
     border: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border);
     border-radius: var(--dxp-s-form-element-radius-border);
 }
 
 lightning-input.slds-form-element div[part="input-text"]:focus-within, /* Backward compatible old override */
 lightning-lookup-address.slds-form-element div[part="input-text"]:focus-within,
 lightning-input.slds-form-element::part(input-text):focus-within /* Native shadow DOM compatible */ {
     border: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border-focus);
 }
 
 lightning-input
     lightning-datepicker
     div[part='input-text']
     .slds-form-element__label:has(~ .slds-form-element__control > input:not(:placeholder-shown)),
 lightning-input.slds-form-element div[part='input-text']:focus-within .slds-form-element__label,
 lightning-input:focus-within::part(label),
 lightning-input.slds-form-element
     div[part='input-text']
     .slds-form-element__label:has(~ .slds-form-element__control > input:-webkit-autofill),
 lightning-input.slds-form-element
     div[part='input-text']
     .slds-form-element__label:has(~ .slds-form-element__control > input:autofill),
 lightning-input.slds-form-element div[part='input-text'][populated] .slds-form-element__label,
 lightning-lookup-address.slds-form-element
     .slds-form-element__label:has(~ .slds-form-element__control input:not(:placeholder-shown)),
 lightning-lookup-address.slds-form-element:focus-within .slds-form-element__label,
 lightning-lookup-address.slds-form-element
     .slds-form-element__label:has(~ .slds-form-element__control input:-webkit-autofill),
 lightning-lookup-address.slds-form-element .slds-form-element__label:has(~ .slds-form-element__control input:autofill) {
     font-size: var(--dxp-s-body-small-font-size);
     top: 4px;
     cursor: default;
 }
 
 lightning-input.slds-form-element div[part='input-text'] .slds-form-element__icon,
 lightning-combobox lightning-helptext {
     top: 5px;
     right: 10px;
     position: absolute;
 }
 
 lightning-input lightning-datepicker div[part='input-text'] .slds-form-element__label,
 lightning-input.slds-form-element div[part='input-text'] .slds-form-element__label,
 lightning-input::part(label),
 lightning-lookup-address.slds-form-element .slds-form-element__label {
     top: 18px;
 }
 
 /* to avoid label overlap with border on focus. */
 .comm-forgot-password__username-input label {
     margin-top: var(--dxp-g-spacing-small);
 }
 
 lightning-input lightning-datepicker div[part='input-text'] lightning-button-icon button.slds-button_icon {
     padding-top: var(--dxp-s-form-element-spacing-block-start);
 }

 /* Date input fixes for iOS Safari only (Android renders correctly without these) */
 @supports (-webkit-touch-callout: none) {
     lightning-input .slds-input[type='date']::-webkit-date-and-time-value, /* Backward compatible old override */
     lightning-input::part(input)::-webkit-date-and-time-value /* Native shadow DOM compatible */ {
         text-align: left;
         padding-top: 8px;
     }

     lightning-input.slds-form-element .slds-input[type='date'] /* Backward compatible old override */ {
         appearance: none;
     }
 }

 lightning-input.slds-form-element .slds-input, /* Backward compatible old override */
 lightning-lookup-address.slds-form-element .slds-input,
 lightning-input.slds-form-element::part(input) /* Native shadow DOM compatible */ {
     border: none;
     box-shadow: none;
     --slds-c-input-shadow: none;
     min-height: var(--var-form-input-element-min-height, 54px);
     border-radius: calc(var(--dxp-s-form-element-radius-border) - var(--dxp-s-form-element-width-border));
     padding-top: calc(var(--dxp-s-form-element-spacing-block-start) + 12px);
     padding-right: var(--dxp-s-form-element-spacing-horizontal-end);
     padding-bottom: var(--dxp-s-form-element-spacing-block-end);
     padding-left: var(--dxp-s-form-element-spacing-horizontal-start);
 }
 
 lightning-input.slds-form-element .slds-input:active, /* Backward compatible old override */
 lightning-input.slds-form-element .slds-input:focus,
 lightning-lookup-address .slds-input:active,
 lightning-lookup-address .slds-input:focus,
 lightning-input.slds-form-element::part(input):active, /* Native shadow DOM compatible */
 lightning-input.slds-form-element::part(input):focus {
     border: none;
     box-shadow: none;
     --slds-c-input-shadow: none;
 }
 
 /* to avoid label overlap with border on focus. */
 .comm-forgot-password__username-input label {
     margin-top: var(--dxp-g-spacing-small);
 }
 
 /* consistent padding under inputs - to avoid collapse on error */
 lightning-input.slds-form-element:not(.slds-has-error),
 lightning-textarea.slds-form-element:not(.slds-has-error),
 lightning-combobox.slds-form-element:not(.slds-has-error),
 lightning-lookup-address.slds-form-element:not(.slds-has-error) {
     padding-bottom: 1rem;
 }
 
 /*for text area*/
 lightning-textarea.slds-form-element {
     position: relative;
 }
 
 lightning-textarea.slds-form-element .slds-textarea:focus {
     border-color: var(--dxp-s-form-element-color-border-focus);
 }
 
 lightning-textarea.slds-form-element.slds-has-error .slds-textarea,
 lightning-textarea.slds-form-element.slds-has-error .slds-textarea:active {
     border: calc(var(--dxp-s-form-element-width-border) + 1px) solid var(--dxp-g-destructive);
     box-shadow: none;
 }
 
 lightning-textarea.slds-form-element.slds-has-error .slds-textarea:focus {
     border: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border-focus);
     box-shadow: none;
 }
 lightning-textarea.slds-form-element:focus-within .slds-form-element__label,
 lightning-textarea.slds-form-element
     .slds-form-element__label:has(+ .slds-form-element__control > textarea:not(:placeholder-shown)) {
     font-size: var(--dxp-s-body-small-font-size);
     padding: 0.375rem 0.75rem 0.375rem 0.75rem;
     cursor: default;
 }

 lightning-textarea.slds-form-element label.slds-form-element__label {
     position: absolute;
     top: var(--dxp-s-form-element-width-border, 1px);
     left: var(--dxp-s-form-element-width-border, 1px);
     right: var(--dxp-s-form-element-width-border, 1px);
     z-index: 1;
     pointer-events: none;
     background-color: var(--dxp-g-root, #ffffff);
     border-radius: calc(var(--dxp-s-form-element-radius-border, 4px) - var(--dxp-s-form-element-width-border, 1px))
                    calc(var(--dxp-s-form-element-radius-border, 4px) - var(--dxp-s-form-element-width-border, 1px))
                    0 0;
 }
 
 lightning-textarea.slds-form-element .slds-textarea {
     padding: 24px 12px 8px;
 }
 
 lightning-textarea.slds-form-element .slds-textarea:active,
 lightning-textarea.slds-form-element .slds-textarea:focus {
     box-shadow: none;
 }
 
 /*for radio*/
 .slds-radio .slds-radio--faux, /* Backward compatible old override */
 .slds-radio .slds-radio_faux,
 lightning-radio-group::part(indicator) /* Native shadow DOM compatible */ {
     width: 1.4rem;
     height: 1.4rem;
 }
 
 /* Updating label color to map it text color based on UX suggestion */
 .slds-radio__label .slds-form-element__label, /* Backward compatible old override */
 lightning-radio-group::part(label) /* Native shadow DOM compatible */ {
     color: var(--dxp-g-root-contrast);
 }
 
 /*for checkbox*/
 .slds-checkbox .slds-checkbox--faux, /* Backward compatible old override */
 .slds-checkbox .slds-checkbox_faux,
 lightning-input::part(indicator) /* Native shadow DOM compatible */ {
     width: 1.4rem;
     height: 1.4rem;
 }
 
 .slds-checkbox [type=checkbox]:checked + .slds-checkbox--faux::after, /* Backward compatible old override */
 .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox--faux::after,
 .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,
 .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox_faux::after,
 lightning-input::part(indicator)::after /* Native shadow DOM compatible */ {
     height: 0.4rem;
     width: 0.75rem;
     top: 43%;
     left: 52%;
     border-color: var(--dxp-g-brand);
 }
 
 /* Updating label color to map it text color based on UX suggestion */
 .slds-checkbox__label .slds-form-element__label, /* Backward compatible old override */
 lightning-input::part(label) /* Native shadow DOM compatible */ {
     color: var(--dxp-g-root-contrast);
 }

/* disabled checkbox will be greyed out */
.slds-checkbox [type="checkbox"]:disabled + .slds-checkbox--faux,
.slds-checkbox [type="checkbox"]:disabled + .slds-checkbox_faux,
.slds-checkbox [type="checkbox"]:disabled ~ .slds-checkbox--faux, 
.slds-checkbox [type="checkbox"]:disabled ~ .slds-checkbox_faux, 
.slds-checkbox [type="checkbox"]:disabled + .slds-checkbox__label .slds-checkbox--faux,
.slds-checkbox [type="checkbox"]:disabled + .slds-checkbox__label .slds-checkbox_faux {
    background-color: var(--com-c-disabled-checkbox-bg-color, #ecebea);
    border-color: var(--com-c-disabled-checkbox-border-color, #c9c7c5);
}

.slds-checkbox [type="checkbox"]:disabled + .slds-checkbox--faux::after,
.slds-checkbox [type="checkbox"]:disabled + .slds-checkbox_faux::after,
.slds-checkbox [type="checkbox"]:disabled ~ .slds-checkbox--faux::after, 
.slds-checkbox [type="checkbox"]:disabled ~ .slds-checkbox_faux::after, 
.slds-checkbox [type="checkbox"]:disabled + .slds-checkbox__label .slds-checkbox--faux::after,
.slds-checkbox [type="checkbox"]:disabled + .slds-checkbox__label .slds-checkbox_faux::after {
    border-color: var(--com-c-disabled-checkbox-check-color, #c9c7c5);
}
 
 /*row alignments*/
 .slds-form-element__row > :first-child,
 .slds-form-element_compound lightning-combobox.slds-form-element {
     padding-left: 0;
     padding-right: 0;
 }
 
 /*column alignments*/
 .slds-form-element__row > *:not(:first-child) {
     padding-left: var(--dxp-g-spacing-xxsmall);
     padding-right: 0;
 }
 
 [data-validate].slds-form-element {
     vertical-align: text-top;
 }
 
 .slds-form-element_address .slds-form-element__row {
     align-items: flex-start;
 }
 
 .slds-form-element, /* Backward compatible old override */
 lightning-slider::part(form-element) {
     /* Native shadow DOM compatible */
     margin-bottom: var(--dxp-g-spacing-xxsmall);
 }
 
 lightning-input-address .slds-form-element:not(:last-child) {
     padding-right: var(--dxp-g-spacing-xxsmall);
 }
 
 /* for dropdown */
 lightning-combobox:not(.slds-has-error) button.slds-combobox__input, /* Backward compatible old override */
 lightning-combobox:not(.slds-has-error)::part(input-button) /* Native shadow DOM compatible */ {
     box-shadow: none;
 }
 
 lightning-combobox:not(.slds-has-error) button.slds-combobox__input:focus, /* Backward compatible old override */
 lightning-combobox:not(.slds-has-error) button.slds-combobox__input:active,
 lightning-combobox:not(.slds-has-error)::part(input-button):focus, /* Native shadow DOM compatible */
 lightning-combobox:not(.slds-has-error)::part(input-button):active {
     box-shadow: none;
 }
 
 lightning-combobox.slds-has-error button.slds-combobox__input:focus, /* Backward compatible old override */
 lightning-combobox.slds-has-error button.slds-combobox__input:active,
 lightning-combobox.slds-has-error::part(input-button):focus, /* Native shadow DOM compatible */
 lightning-combobox.slds-has-error::part(input-button):active {
     border: calc(var(--dxp-s-form-element-width-border) + 1px) solid var(--dxp-g-destructive);
 }
 
 lightning-combobox [part="combobox"], /* Backward compatible old override */
 lightning-combobox::part(combobox) /* Native shadow DOM compatible */ {
     position: relative;
 }
 
 lightning-combobox [part="combobox"] label.slds-form-element__label, /* Backward compatible old override */
 lightning-combobox::part(label) /* Native shadow DOM compatible */ {
     top: 4px;
     font-size: var(--dxp-s-body-small-font-size);
     z-index: 1;
 }
 
 lightning-combobox [part="combobox"] lightning-base-combobox [part="input-text"] [part="input-container"] input, /* Backward compatible old override */
 lightning-combobox [part="combobox"] lightning-base-combobox button.slds-combobox__input,
 lightning-combobox::part(input), /* Native shadow DOM compatible */
 lightning-combobox::part(input-button) {
     min-height: var(--var-form-input-element-min-height, 54px);
     border: none;
     box-shadow: none;
     border-radius: calc(var(--dxp-s-form-element-radius-border) - var(--dxp-s-form-element-width-border));
     padding-top: calc(var(--dxp-s-form-element-spacing-block-start) + 12px);
     padding-right: var(--dxp-s-form-element-spacing-horizontal-end);
     padding-bottom: var(--dxp-s-form-element-spacing-block-end);
     padding-left: var(--dxp-s-form-element-spacing-horizontal-start);
 }
 
 lightning-combobox [part="combobox"] lightning-base-combobox .slds-combobox__form-element, /* Backward compatible old override */
 lightning-combobox::part(input-button) /* Native shadow DOM compatible */ {
     border: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border);
     border-radius: var(--dxp-s-form-element-radius-border);
 }
 
 lightning-combobox.slds-has-error [part="combobox"] lightning-base-combobox .slds-combobox__form-element, /* Backward compatible old override */
 lightning-combobox.slds-has-error::part(input-button) {
     /* Native shadow DOM compatible */
     border: calc(var(--dxp-s-form-element-width-border) + 1px) solid var(--dxp-g-destructive);
     border-radius: var(--dxp-s-form-element-radius-border);
 }
 
 lightning-combobox [part="combobox"] lightning-base-combobox .slds-combobox__form-element:has(.slds-input:focus), /* Backward compatible old override */
 lightning-combobox [part="combobox"] lightning-base-combobox .slds-combobox__form-element:has(button.slds-combobox__input:focus),
 lightning-combobox.slds-has-error [part="combobox"] lightning-base-combobox .slds-combobox__form-element:has(.slds-input:focus),
 lightning-combobox::part(input):focus, /* Native shadow DOM compatible */
 lightning-combobox::part(input-button):focus,
 lightning-combobox.slds-has-error::part(input):focus {
     border: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border-focus);
     border-radius: var(--dxp-s-form-element-radius-border);
 }
 
 lightning-combobox [part="combobox"] lightning-base-combobox button.slds-combobox__input > span, /* Backward compatible old override */
 lightning-combobox::part(input-button-value) /* Native shadow DOM compatible */ {
     margin-top: 8px;
     margin-right: 1rem;
 }

/* Label-hidden variant override */
lightning-combobox[variant="label-hidden"] [part="combobox"] lightning-base-combobox button.slds-combobox__input > span,
lightning-combobox[variant="label-hidden"]::part(input-button-value) {
     margin-top: 0;
 }

 /*
 * for Select List
 * We are using default html select boxes rather than lightning-base-combobox
 * eg. country and state field in address
 * to keep the UI same we have to keep below css
 * which should be removed once we have lightning-base-combobox in place.
 * The referential css is required so that no other select box get affected. Eg. Product Page
 */
lightning-picklist lightning-select label.slds-form-element__label {
    top: 28px;
    font-size: var(--dxp-s-body-small-font-size);
    z-index: 1;
    left: 8px;
}

lightning-picklist lightning-select .slds-form-element__control .slds-select_container [part='select'].slds-select {
    height: 56px;
    padding-left: 0.75rem;
    padding-top: 15px;
}

/* targeting mobile view to manage the alignment of input types*/
@media (max-width: 47.9375em) {
    lightning-input.slds-size_1-of-2 {
        width: 100%;
    }

    lightning-input-address .slds-form-element__row {
        flex-wrap: wrap;
    }

    lightning-input-address .slds-form-element__row lightning-input,
    lightning-input-address .slds-form-element__row lightning-picklist,
    lightning-input-address .slds-form-element__row lightning-lookup-address {
        width: 100%;
        padding-left: 0;
    }

    .slds-form-element__row > *:not(:first-child),
    .slds-form-element__row lightning-input.slds-form-element.name-field {
        padding-left: 0;
    }

    /* consistent padding under inputs - to avoid collapse on error */
    lightning-picklist.slds-form-element:not(.slds-has-error) {
        padding-bottom: 1rem;
    }

    /* consistent padding under inputs - to avoid collapse on error */
    lightning-lookup-address.slds-form-element:not(.slds-has-error) {
        padding-bottom: 1rem;
    }

    lightning-input-address .slds-form-element:nth-child(1),
    slds-form-element.name-field:nth-child(1) {
        --dxp-g-spacing-xxsmall: 0px;
    }

    aside.navigation {
        padding-top: var(--dxp-g-spacing-xsmall);
        padding-bottom: 0;
    }
}

/* targeting tablet view to manage the alignment of input types*/
@media only screen and (min-width: 48em) and (max-width: 64.0625em) {
    lightning-select.slds-form-element:not(.slds-has-error) {
        padding: 0rem;
    }

    lightning-picklist lightning-select label.slds-form-element__label {
        top: 5%;
    }
}


lightning-datepicker:has(lightning-helptext) .slds-input__icon button {
 	position: absolute;
	right: 25px;
}
lightning-datepicker lightning-helptext {
    top: 10px;
    right: 0px;
    position: absolute;
}
lightning-combobox:has(lightning-helptext) lightning-base-combobox .slds-input__icon-group lightning-icon lightning-primitive-icon {
    right: 25px;
    position: absolute;
}
lightning-input:has(input[type="search"]) div[part="input-text"] .slds-form-element__label {
    left: 37px;
}
lightning-input:has(input[type="search"]) div[part="input-container"] {
    padding-left: 26px;
}
lightning-input:has(input[type="search"]):has(lightning-helptext) button.slds-input__icon_right[data-element-id="searchClear"] {
    right: 35px;
    top: 5px;
}
lightning-input:has(input[type="search"]):not(:has(lightning-helptext)) button.slds-input__icon_right[data-element-id="searchClear"] {
   top: 5px;
   right: 10px;
}
/* Fix color picker button vertical position inside lightning-input */
lightning-input:has(button[part="color-picker-button"]) button[part="color-picker-button"] {
    top: 1.0625em; 
}

/* Fix label position for empty (unpopulated) datetime-local input to prevent overlap with placeholder */
lightning-input:has(input[type="datetime-local"]) div[part="input-text"]:not([populated]) label[part="label"] {
    top: 0.1875em;
}

/* Position helptext (ⓘ) icon to the right side of color picker input, vertically centered */
lightning-input:has(lightning-primitive-colorpicker-button):has(lightning-helptext) lightning-helptext {
    position: absolute;
    right: 0.5625em; 
    top: 50%;
    transform: translateY(-50%);
}

/* Position helptext (ⓘ) icon inline beside the radio group label, vertically centered */
.slds-form-element:has(lightning-radio-group) > .slds-form-element__label lightning-helptext {
    display: inline-flex;
    align-items: center;
    position: relative;
    right: -0.25em; 
    top: -0.125em; 
}


/* Desktop */
lightning-input:has(lightning-datetimepicker):has(lightning-helptext) lightning-helptext {
    position: absolute;
    right: 19.625em;
    top: 63%;
    transform: translateY(-50%);
}

/* Make datetime picker container relative */
lightning-input:has(lightning-datetimepicker):has(lightning-helptext) {
    position: relative;
}
    
  lightning-input:has(input[type="datetime-local"]):has(lightning-helptext) input[type="datetime-local"] {
    flex: 1;
    min-width: 0;
    margin-bottom: 0.3em;
}

/* Mobile and Tablet (consolidated - styles are identical) */
@media only screen and (max-width: 64em) {
    lightning-input:has(input[type="datetime-local"]):has(lightning-helptext) div[part="input-text"] {
        position: relative;
    }
    lightning-input:has(input[type="datetime-local"]):has(lightning-helptext) div[part="input-container"] {
        display: flex;
        align-items: center;
        padding-right: 2.5em;
    }
    lightning-input:has(input[type="datetime-local"]):has(lightning-helptext) input[type="datetime-local"] {
        flex: 1;
        min-width: 0;
    }
    lightning-input:has(input[type="datetime-local"]):has(lightning-helptext) lightning-helptext {
        position: absolute;
        right: 0.4em;
        bottom: 3.1em;
        top: auto;
        transform: none;
        display: flex;
        align-items: center;
        z-index: 1;
    }
    lightning-input:has(input[type="datetime-local"]):has(lightning-helptext) lightning-helptext .slds-form-element__icon {
        display: flex;
        align-items: center;
        border-left: 0.0625em solid #c9c9c9;
        padding-left: 0.4em;
        height: 1.5em;
    }
}
/* Self Register v2 styles start */
commerce_builder-self-register-v2 lightning-input::part(label) {
    color: var(--dxp-s-form-element-label-color, var(--dxp-g-root-contrast));
    padding-top: 0;
    font-family: var(--dxp-s-form-element-label-font-family, var(--dxp-s-body-font-family));
    font-style: var(--dxp-s-form-element-label-font-style, var(--dxp-s-body-font-style));
    text-decoration: var(--dxp-s-form-element-label-text-decoration);
    text-transform: var(--dxp-s-form-element-label-text-transform, var(--dxp-s-body-text-transform));
    line-height: var(--dxp-s-form-element-label-line-height, var(--dxp-s-body-line-height));
    letter-spacing: var(--dxp-s-form-element-label-letter-spacing, var(--dxp-s-body-letter-spacing));
}

commerce_builder-self-register-v2 lightning-input::part(label):not(.slds-form-element__legend) {
    font-weight: var(--dxp-s-form-element-label-font-weight, var(--dxp-s-body-font-weight));
}

commerce_builder-self-register-v2 lightning-input::part(input-container) {
    border: none;
    box-shadow: none;
}

commerce_builder-self-register-v2 lightning-input::part(input){
    background-color: var(--input-color-background);
    font-size: var(--dxp-c-input-text-font-size, var(--dxp-s-form-element-text-font-size, var(--dxp-s-body-font-size)));
    font-family: var(--dxp-s-form-element-text-font-family, var(--dxp-s-body-font-family));
    font-weight: var(--dxp-s-form-element-text-font-weight, var(--dxp-s-body-font-weight));
    font-style: var(--dxp-s-form-element-text-font-style, var(--dxp-s-body-font-style));
    text-decoration: var(--dxp-s-form-element-text-text-decoration);
    text-transform: var(--dxp-s-form-element-text-text-transform, var(--dxp-s-body-text-transform));
    line-height: var(--dxp-s-form-element-text-line-height, var(--dxp-s-body-line-height));
    letter-spacing: var(--dxp-s-form-element-text-letter-spacing, var(--dxp-s-body-letter-spacing));
    color: var(--sds-c-input-text-color, var(--dxp-s-form-element-text-color, var(--dxp-g-root-contrast)));
    border-inline-start:var(--dxp-c-input-border-inline-start, var(--dxp-s-form-element-border-inline-start, var(--border-width) solid var(--border-color)));border-inline-end: var(--dxp-c-input-border-inline-end, var(--dxp-s-form-element-border-inline-end, var(--border-width) solid var(--border-color)));
    border-block-start:var(--dxp-c-input-border-block-start, var(--dxp-s-form-element-border-block-start, var(--border-width) solid var(--border-color)));border-block-end: var(--dxp-c-input-border-block-end, var(--dxp-s-form-element-border-block-end, var(--border-width) solid var(--border-color)));
}

commerce_builder-self-register-v2 lightning-icon::part(icon){
    fill: inherit;
}

commerce_builder-self-register-v2 lightning-input[populated]::part(label){
    font-size: var(--dxp-s-body-small-font-size);
    top: 4px;
    cursor: default;
}
/* Self Register v2 styles end */


/* Styles for phone number field start */
commerce_unified_checkout-multi-country-phone-field .slds-form-element:focus-within .slds-form-element__label,
commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control .slds-form-element input:-webkit-autofill),
commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control .slds-form-element input:autofill),
commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control .slds-form-element div[part='input-text'][populated]),
commerce_unified_checkout-multi-country-phone-field lightning-input[populated]::part(label) {
    font-size: var(--dxp-s-body-small-font-size);
    top: 6px;
    cursor: default;
}

commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-combobox_container {
    min-height: var(--var-form-input-element-min-height, 54px);
    border: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border);
    border-radius: var(--dxp-s-form-element-radius-border) 0 0 var(--dxp-s-form-element-radius-border);
    position: relative;
    min-width: 85px;
    background-color: var(
        --sds-c-input-color-background,
        var(--dxp-s-form-element-color-background, var(--dxp-g-root))
    );
    top: 0;
}

commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-combobox_container:focus-within,
commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-combobox_container:has(button.slds-has-focus) {
    background-color: var(
        --sds-c-input-color-background-focus,
        var(--dxp-s-form-element-color-background-active, var(--dxp-s-form-element-color-background, var(--dxp-g-root)))
    );
}

commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-combobox_container:focus-within {
    border-color: var(--dxp-s-form-element-color-border-focus);
}

commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-combobox__input.slds-has-focus,
commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-combobox__input:focus {
    border: none;
    box-shadow: none;
    --slds-c-input-shadow: none;
}

commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    div[part='input-text'],
    commerce_unified_checkout-multi-country-phone-field lightning-input::part(input-text) {
    border-radius: 0 var(--dxp-s-form-element-radius-border) var(--dxp-s-form-element-radius-border) 0;
    border-left: 0;
}

commerce_unified_checkout-multi-country-phone-field .slds-form-element .slds-form-element__control .slds-input,
commerce_unified_checkout-multi-country-phone-field lightning-input::part(input)  {
    border-radius: 0 calc(var(--dxp-s-form-element-radius-border) - var(--dxp-s-form-element-width-border))
        calc(var(--dxp-s-form-element-radius-border) - var(--dxp-s-form-element-width-border)) 0;
    border-left: 0;
}

commerce_unified_checkout-multi-country-phone-field
    .slds-form-element
    .slds-form-element__control
    .slds-combobox__input {
    border-radius: var(--dxp-s-form-element-radius-border) 0 0 var(--dxp-s-form-element-radius-border);
    min-height: var(--var-form-input-element-min-height, 54px);
    padding-top: 4px;
}

commerce_unified_checkout-multi-country-phone-field .slds-form-element label.slds-form-element__label {
    position: absolute;
    left: 12px;
}
/* Styles for phone number field ends */

commerce_cart-apply-coupon-button button,
commerce_cart-apply-coupon-button button.slds-button.dxp-button-small,
commerce_cart-apply-coupon-button button.slds-button.dxp-button-large {
    border-radius: var(--dxp-s-button-radius-border), var(--com-c-cart-apply-coupon-button-border-radius);
}

commerce_product_details-gallery {
    --com-c-product-gallery-image-width-mobile: 200;
    --com-c-product-gallery-image-width-tablet: 400;
    --com-c-product-gallery-image-width-desktop: 450;
}

commerce_builder-purchase-options .quantity-list-container .quantity-list-action,
commerce_builder-purchase-options .quantity-list-container .quantity-list-action commerce_product_details-add-quantity .container {
    flex-direction: column;
}

commerce_builder-purchase-options .quantity-list-container .quantity-list-action commerce_product_details-add-quantity .container {
    gap: 1rem;
} 

commerce_builder-purchase-options .quantity-list-container .quantity-list-action commerce_product_details-add-quantity, 
commerce_builder-purchase-options .quantity-list-container .quantity-list-action commerce_builder-product-configure-button,
commerce_builder-purchase-options .quantity-list-container .quantity-list-action commerce-action-button button {
    width: 100%;    
}

/* 
  Overridden width and margin-right for wishlist button in mobile view.
  Added CSS hooks for future customer overrides.
*/
commerce_builder-purchase-options .quantity-list-action commerce-action-button {
    width: var(--com-c-button-width, 100%) !important;
    margin-right: var(--com-c-button-margin-right, auto) !important;
}

/* * for payment iframe * the css for payment details is targeting inside the iframe so referring it based on the type of input * this will help in achieving the same UI look as per new styling */
[data-card-number-container].slds-form-element label.slds-form-element__label,
[data-expiry-container].slds-form-element label.slds-form-element__label,
[data-cvv-container].slds-form-element label.slds-form-element__label,
.slds-form-element-cardholder-name.slds-form-element label.slds-form-element__label {
    z-index: 1;
    top: 18px;
    left: 12px;
}

[data-card-number-container].slds-form-element label.slds-form-element__label.card-input-label,
[data-expiry-container].slds-form-element label.slds-form-element__label.card-input-label,
[data-cvv-container].slds-form-element label.slds-form-element__label.card-input-label,
.slds-form-element-cardholder-name.slds-form-element label.slds-form-element__label.card-input-label {
    padding: 0 12px;
}

[data-card-number-container].slds-form-element:not(.slds-has-error),
[data-expiry-container].slds-form-element:not(.slds-has-error),
[data-cvv-container].slds-form-element:not(.slds-has-error),
.slds-form-element-cardholder-name.slds-form-element:not(.slds-has-error) {
    padding-bottom: 1rem;
}

[data-card-number-container].slds-form-element .slds-form-element__control .slds-input,
[data-expiry-container].slds-form-element .slds-form-element__control .slds-input,
[data-cvv-container].slds-form-element .slds-form-element__control .slds-input,
.slds-form-element-cardholder-name.slds-form-element .slds-form-element__control .slds-input {
    height: 56px;
    padding-top: 10px;
    box-shadow: none;
    border: var(--dxp-s-form-element-width-border) solid var(--dxp-s-form-element-color-border);
    border-radius: var(--dxp-s-form-element-radius-border);
    background-color: var(
        --sds-c-input-color-background,
        var(--dxp-s-form-element-color-background, var(--dxp-g-root))
    );
}

[data-card-number-container].slds-has-error .slds-input,
[data-expiry-container].slds-has-error .slds-input,
[data-cvv-container].slds-has-error .slds-input,
.slds-form-element-cardholder-name.slds-has-error .slds-input {
    border: var(--dxp-s-form-element-width-border) solid var(--dxp-g-destructive);
    box-shadow: none;
}

[data-card-number-container].slds-form-element:focus-within .slds-form-element__label,
[data-expiry-container].slds-form-element:focus-within .slds-form-element__label,
[data-cvv-container].slds-form-element:focus-within .slds-form-element__label,
.slds-form-element-cardholder-name.slds-form-element:focus-within .slds-form-element__label,
[data-card-number-container].slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control input:not(:placeholder-shown)),
[data-expiry-container].slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control input:not(:placeholder-shown)),
[data-cvv-container].slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control input:not(:placeholder-shown)),
.slds-form-element-cardholder-name.slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control input:not(:placeholder-shown)),
[data-card-number-container].slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control #expiry-date:placeholder-shown),
[data-expiry-container].slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control #expiry-date:placeholder-shown),
[data-cvv-container].slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control #expiry-date:placeholder-shown),
.slds-form-element-cardholder-name.slds-form-element
    .slds-form-element__label:has(~ .slds-form-element__control #expiry-date:placeholder-shown) {
    font-size: var(--dxp-s-body-small-font-size);
    top: 4px;
}

/* targeting mobile view to avoid overlap of cards icons with input number */
@media (max-width: 47.9375em) {
    [data-card-number-container].slds-form-element .slds-form-element__control .slds-input {
        height: 72px;
    }

    .accordion-content[data-accordion-section-content="credit-card"] {
        padding: 1rem;
    }

    #credit-cards-accepted svg {
        width: 1.5rem;
    }
}

/* Quick Order styles start */
commerce-quick-order-display commerce-quick-order-item lightning-input.slds-form-element .slds-input::placeholder{
    color: transparent;
}
commerce-quick-order-display commerce-quick-order-item commerce-quantity-selector commerce-number-input .slds-input.number-input__input {
    border-radius: calc(var(--dxp-s-form-element-radius-border) - var(--dxp-s-form-element-width-border));
    min-height: calc(var(--var-form-input-element-min-height, 54px) + 2px);
}
commerce-quick-order-display commerce-quick-order-item div.contents,
commerce-quick-order-display commerce-quick-order-item div.actions {
    align-self: start;
}

/* Needed to handle error state for quick order search input */
commerce-quick-order-display commerce-quick-order-item div.search-input.slds-has-error div[part="input-text"]{
    border: calc(var(--dxp-s-form-element-width-border) + 1px) solid var(--dxp-g-destructive);
}
commerce-quick-order-display commerce-quick-order-item div.search-input.slds-has-error lightning-input.slds-form-element {
    padding-bottom: 0rem;
}
/* Quick Order styles end */

/* To hide recaptcha badge */
.grecaptcha-badge {
    visibility: hidden;
}

/* Hide placeholders for Contact Support Form & Lead Form */
dxp_form-contact-support-form lightning-input.slds-form-element .slds-input::placeholder,
dxp_form-lead-form lightning-input.slds-form-element .slds-input::placeholder {
    color: transparent;
}

/* Checkout Payment Sheet With Purchase Order Button Alignment */
commerce_builder-checkout-payment-sheet-with-purchase-order .button-container button {
    display: flex !important;
    justify-content: space-around;
    margin-top: var(--dxp-g-spacing-small, 0.75rem);
}

commerce_builder-checkout-payment-sheet-with-purchase-order .button-container button svg {
    fill: currentColor !important;
}

/* Theme changes for product configurator modal */
runtime_industries_cfg-pricing-summary-option .optionName .slds-truncate {
    max-width: 100%;
  }
  
  runtime_industries_cfg-pricing-summary-pane .detailHeader {
    padding: 1rem;
  }
  
  runtime_industries_cfg-pricing-summary .totalsSection {
    --footerHeight: var(--lwc-spacingXxLarge, 3.5rem);
  }
  
  runtime_industries_cfg-action-footer .spacer-element .slds-docked-form-footer {
    --componentHeight: 4.5rem;
    padding-bottom: 1rem;
  }
  
runtime_industries_cfg-transaction-header,
runtime_industries_cfg-favorite-container,
runtime_industries_cfg-product-header .psm-option-value,
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.monthlyTotal),
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.annualTotal),
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.quarterlyTotal),
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.semiAnnualTotal),
runtime_industries_cfg-pricing-summary .totalsSection .slds-grid:has(.defaultNetAmount) {
    display: none;
}

runtime_industries_cfg-search-bar .search-input lightning-primitive-input-simple div[part="input-container"] input {
    padding-left: 2rem;
    padding-top: 0rem;
}

runtime_industries_cfg-config-header .header-banner-spacer {
    --banner-height: 6rem;
}

runtime_industries_cfg-option runtime_industries_cfg-product-header .phc lightning-input.slds-form-element {
    padding-bottom: 0rem;
}

runtime_industries_cfg-pricing-summary-option .slds-col.slds-text-align_start {
    text-align: start;
}

/* Shared Dealer Connect branding. Higher specificity keeps Builder theme defaults from diverging. */
:root:root {
    --dxp-g-brand:#1C1C1C;
    --dxp-s-text-heading-medium-letter-spacing:0;
    --dxp-s-form-element-text-font-family:var(--dxp-s-html-font-family);
    --dxp-s-form-element-spacing-horizontal-start:12px;
    --dxp-s-text-heading-small-text-decoration:none;
    --dxp-s-dropdown-text-color:#1C1C1C;
    --dxp-s-tertiary-button-text-color:var(--dxp-s-button-color);
    --dxp-s-form-element-caption-text-font-family:var(--dxp-s-html-font-family);
    --dxp-s-form-element-spacing-block-start:0px;
    --dxp-g-neutral-contrast-3:#ffffff;
    --dxp-s-text-heading-medium-text-transform:none;
    --dxp-g-neutral-contrast-2:#000000;
    --dxp-g-neutral-contrast-1:#000000;
    --dxp-s-button-color-focus-contrast:var(--dxp-s-button-color-contrast-1);
    --dxp-s-tertiary-button-border-color-1:rgba(0,0,0,0);
    --dxp-s-button-border-color-active:var(--dxp-s-button-border-color-focus);
    --dxp-s-link-text-color-1:var(--dxp-g-brand-1);
    --dxp-s-form-element-label-font-style:normal;
    --dxp-g-info:#16325c;
    --dxp-g-root:#FFF;
    --dxp-s-tertiary-button-text-color-focus:var(--dxp-s-tertiary-button-text-color-1);
    --dxp-s-form-element-text-text-decoration:none;
    --dxp-s-form-element-caption-text-font-weight:500;
    --dxp-s-body-line-height:1.28;
    --dxp-s-text-heading-extra-small-font-style:normal;
    --dxp-s-button-large-padding-block-end:0.875rem;
    --dxp-s-body-text-decoration:none;
    --dxp-s-section-content-spacing-inline-end-mobile:1rem;
    --dxp-s-form-element-text-font-weight:400;
    --dxp-s-tertiary-button-color-1:rgba(0,0,0,0);
    --dxp-s-text-heading-medium-font-style:normal;
    --dxp-s-form-checkbox-color-background-checked:var(--dxp-s-form-checkbox-color-background);
    --dxp-s-secondary-button-color-focus:var(--dxp-s-secondary-button-color-1);
    --dxp-s-text-heading-extra-extra-small-line-height:1.25;
    --dxp-g-warning-2:#e27d00;
    --dxp-g-warning-3:#673900;
    --dxp-s-form-element-color-border:rgb(112, 114, 117);
    --dxp-g-warning-1:#ffa534;
    --dxp-s-header-content-max-width-mobile:none;
    --dxp-s-secondary-button-color-hover:var(--dxp-s-secondary-button-color-1);
    --dxp-s-text-heading-large-letter-spacing:0;
    --dxp-s-button-padding-inline-end:0.75rem;
    --dxp-s-tertiary-button-border-color-hover:var(--dxp-s-tertiary-button-border-color-1);
    --dxp-s-tertiary-button-border-color-focus:var(--dxp-s-tertiary-button-border-color-1);
    --dxp-s-body-font-style:normal;
    --dxp-g-warning-contrast:#000000;
    --dxp-s-form-element-text-text-transform:none;
    --dxp-s-button-large-padding-inline-start:1.0rem;
    --dxp-s-text-heading-medium-line-height:1.36;
    --dxp-s-column-spacer-size:1rem;
    --dxp-s-text-heading-large-text-transform:none;
    --dxp-s-secondary-button-border-color:var(--dxp-s-button-color);
    --dxp-s-text-heading-extra-large-letter-spacing:0;
    --dxp-s-text-heading-large-font-size:2rem;
    --dxp-s-secondary-button-text-color:var(--dxp-s-button-color);
    --dxp-s-form-element-text-font-style:normal;
    --dxp-s-button-font-family:var(--dxp-s-html-font-family);
    --dxp-s-form-element-placeholder-text-color:var(--dxp-g-neutral-3);
    --dxp-s-form-element-color-background:#FFF;
    --dxp-s-tertiary-button-border-color-active:var(--dxp-s-tertiary-button-border-color-focus);
    --dxp-s-button-padding-block-start:0.625rem;
    --dxp-s-text-heading-extra-extra-small-font-style:normal;
    --dxp-s-button-font-weight:600;
    --dxp-s-body-font-weight:400;
    --dxp-s-body-small-line-height:1.28;
    --dxp-s-html-font-family:"Lato", Arial, sans-serif;
    --dxp-g-offline:#444444;
    --dxp-s-button-small-font-size:0.9rem;
    --dxp-s-button-radius-border:100px;
    --dxp-s-button-small-padding-block-end:0.5rem;
    --dxp-s-component-wrapper-spacer-size-mobile:0.5rem;
    --dxp-s-form-element-label-font-size:1rem;
    --dxp-s-text-heading-extra-small-line-height:1.25;
    --dxp-s-text-heading-small-line-height:1.25;
    --dxp-s-section-content-spacing-block-end:0rem;
    --dxp-s-secondary-button-text-color-focus:var(--dxp-s-secondary-button-text-color-1);
    --dxp-g-success-3:#07190f;
    --dxp-g-warning:#ffb75d;
    --dxp-g-success-2:#237747;
    --dxp-g-success-1:#36b66c;
    --dxp-s-button-small-padding-inline-end:0.625rem;
    --dxp-s-column-spacer-size-mobile:0.75rem;
    --dxp-s-text-heading-small-font-family:var(--dxp-s-html-font-family);
    --dxp-s-text-heading-large-font-style:normal;
    --dxp-g-info-contrast-3:#ffffff;
    --dxp-s-form-checkbox-color-border-checked:var(--dxp-s-form-checkbox-color-border);
    --dxp-s-button-color-active:var(--dxp-s-button-color-focus);
    --dxp-s-section-content-spacing-inline-start-mobile:1rem;
    --dxp-s-section-content-spacing-block-end-mobile:1.5rem;
    --dxp-s-html-font-size:1rem;
    --dxp-s-body-font-family:var(--dxp-s-html-font-family);
    --dxp-s-link-text-decoration-focus:underline;
    --dxp-g-info-contrast-1:#ffffff;
    --dxp-s-dropdown-text-color-hover:#707275;
    --dxp-g-info-contrast-2:#ffffff;
    --dxp-s-text-heading-extra-large-font-family:var(--dxp-s-html-font-family);
    --dxp-s-text-heading-medium-text-decoration:none;
    --dxp-s-secondary-button-color-active:var(--dxp-s-secondary-button-color-focus);
    --dxp-s-form-element-label-line-height:1.75;
    --dxp-s-text-heading-extra-extra-small-font-family:var(--dxp-s-html-font-family);
    --dxp-s-text-heading-small-font-weight:400;
    --dxp-s-text-heading-large-font-weight:400;
    --dxp-s-form-element-text-color:var(--dxp-g-root-contrast);
    --dxp-g-destructive-contrast:#ffffff;
    --dxp-s-form-checkbox-radius-border:4px;
    --dxp-g-destructive-contrast-1:#ffffff;
    --dxp-g-destructive-contrast-2:#ffffff;
    --dxp-g-root-1:#FFF;
    --dxp-g-destructive-contrast-3:#ffffff;
    --dxp-g-root-2:#FFF;
    --dxp-s-section-content-spacing-inline-start:2rem;
    --dxp-g-root-3:#FFF;
    --dxp-s-button-color-1:var(--dxp-g-brand-1);
    --dxp-s-form-element-color-background-active:var(--dxp-s-form-element-color-background);
    --dxp-s-body-text-color:var(--dxp-g-root-contrast);
    --dxp-s-footer-content-max-width-mobile:none;
    --dxp-g-brand-contrast:#FFF;
    --dxp-s-button-border-color-hover:var(--dxp-s-button-color-hover);
    --dxp-s-text-heading-extra-small-letter-spacing:0em;
    --dxp-s-form-element-width-border:1px;
    --dxp-s-body-small-text-color:var(--dxp-g-root-contrast);
    --dxp-s-form-checkbox-width-border:1px;
    --dxp-s-button-color-active-contrast:var(--dxp-s-button-color-focus-contrast);
    --dxp-s-button-line-height:1.25;
    --dxp-s-button-small-padding-inline-start:0.625rem;
    --dxp-s-text-heading-extra-extra-small-text-transform:none;
    --dxp-s-form-element-color-border-focus:rgb(23, 126, 171);
    --dxp-s-button-large-radius-border:100px;
    --dxp-s-text-heading-extra-extra-small-font-weight:600;
    --dxp-s-button-border-color:var(--dxp-s-button-color);
    --dxp-s-secondary-button-color:var(--dxp-g-root);
    --dxp-s-text-heading-extra-small-text-decoration:none;
    --dxp-s-text-heading-extra-extra-small-color:var(--dxp-g-root-contrast);
    --dxp-s-form-element-radius-border:20px;
    --dxp-s-form-element-text-color-focus:var(--dxp-s-form-element-text-color);
    --dxp-s-tertiary-button-border-color:rgba(0,0,0,0);
    --dxp-g-destructive:#c23934;
    --dxp-s-tertiary-button-color-active:var(--dxp-s-tertiary-button-color-focus);
    --dxp-s-dropdown-color-border:#D9DFE7;
    --dxp-g-offline-contrast:#ffffff;
    --dxp-s-text-heading-large-color:var(--dxp-g-root-contrast);
    --dxp-s-button-large-padding-block-start:0.875rem;
    --dxp-s-link-text-decoration-hover:underline;
    --dxp-s-button-color-focus:var(--dxp-s-button-color-1);
    --dxp-s-form-element-text-line-height:1.9;
    --dxp-s-form-element-caption-text-line-height:1.5;
    --dxp-s-body-small-font-family:var(--dxp-s-html-font-family);
    --dxp-s-body-small-letter-spacing:0;
    --dxp-s-text-heading-extra-large-text-transform:none;
    --dxp-s-form-element-label-text-transform:none;
    --dxp-g-success:#4bca81;
    --dxp-s-form-checkbox-color-background:var(--dxp-s-form-element-color-background);
    --dxp-s-form-element-label-letter-spacing:0em;
    --dxp-s-form-element-label-font-weight:500;
    --dxp-s-button-text-decoration:none;
    --dxp-s-text-heading-extra-large-line-height:1.48;
    --dxp-s-button-border-color-focus:var(--dxp-s-button-color-focus);
    --dxp-g-warning-contrast-3:#ffffff;
    --dxp-s-button-large-font-size:1.0rem;
    --dxp-s-button-small-radius-border:100px;
    --dxp-s-body-font-size:0.875rem;
    --dxp-s-dropdown-color-background:var(--dxp-g-root);
    --dxp-s-body-small-text-decoration:none;
    --dxp-s-secondary-button-text-color-active:var(--dxp-s-secondary-button-text-color-focus);
    --dxp-s-text-heading-large-line-height:1.36;
    --dxp-s-button-color-hover:var(--dxp-s-button-color-1);
    --dxp-s-button-font-size:1.0rem;
    --dxp-s-button-letter-spacing:0;
    --dxp-g-warning-contrast-2:#000000;
    --dxp-g-warning-contrast-1:#000000;
    --dxp-s-button-padding-inline-start:0.75rem;
    --dxp-g-root-contrast-1:#1C1C1C;
    --dxp-g-root-contrast:#1C1C1C;
    --dxp-g-root-contrast-2:#1C1C1C;
    --dxp-g-root-contrast-3:#1C1C1C;
    --dxp-s-header-content-max-width:1800px;
    --dxp-s-section-columns-max-width:1800px;
    --dxp-s-form-element-spacing-block-end:0px;
    --dxp-s-button-text-transform:none;
    --dxp-s-body-text-transform:none;
    --dxp-s-form-element-label-font-family:var(--dxp-s-html-font-family);
    --dxp-s-form-checkbox-color-border:var(--dxp-s-form-element-color-border);
    --dxp-s-form-element-caption-text-text-transform:none;
    --dxp-s-body-letter-spacing:0;
    --dxp-s-form-element-caption-text-letter-spacing:0;
    --dxp-s-tertiary-button-color:rgba(0,0,0,0);
    --dxp-s-body-small-font-style:normal;
    --dxp-s-text-heading-small-font-style:normal;
    --dxp-s-text-heading-extra-extra-small-font-size:0.625rem;
    --dxp-s-text-heading-small-color:var(--dxp-g-root-contrast);
    --dxp-s-section-content-spacing-block-start:0rem;
    --dxp-s-html-font-size-mobile:1rem;
    --dxp-s-section-content-spacing-inline-end:2rem;
    --dxp-s-body-small-font-weight:400;
    --dxp-g-offline-3:#000000;
    --dxp-g-offline-2:#070707;
    --dxp-g-offline-1:#303030;
    --dxp-s-button-color-contrast-1:var(--dxp-g-brand-contrast-1);
    --dxp-s-secondary-button-border-color-active:var(--dxp-s-secondary-button-border-color-focus);
    --dxp-s-text-heading-extra-extra-small-letter-spacing:0em;
    --dxp-s-text-heading-extra-large-text-decoration:none;
    --dxp-g-success-contrast:#000000;
    --dxp-s-text-heading-small-font-size:1.0rem;
    --dxp-s-button-font-style:normal;
    --dxp-s-body-small-text-transform:none;
    --dxp-g-brand-contrast-1:#FFF;
    --dxp-g-brand-contrast-3:#FFF;
    --dxp-s-button-color-hover-contrast:var(--dxp-s-button-color-contrast-1);
    --dxp-g-brand-contrast-2:#FFF;
    --dxp-g-brand-1:#1C1C1C;
    --dxp-g-brand-2:#1C1C1C;
    --dxp-g-brand-3:#1C1C1C;
    --dxp-s-secondary-button-text-color-1:var(--dxp-s-button-color-1);
    --dxp-s-link-text-color-hover:var(--dxp-s-link-text-color-1);
    --dxp-g-offline-contrast-3:#ffffff;
    --dxp-g-offline-contrast-2:#ffffff;
    --dxp-s-button-small-padding-block-start:0.5rem;
    --dxp-s-tertiary-button-color-hover:var(--dxp-s-tertiary-button-color-1);
    --dxp-s-text-heading-extra-small-font-family:var(--dxp-s-html-font-family);
    --dxp-s-form-element-caption-text-text-decoration:none;
    --dxp-s-body-small-font-size:0.75rem;
    --dxp-g-destructive-1:#a2302b;
    --dxp-g-offline-contrast-1:#ffffff;
    --dxp-s-text-heading-small-text-transform:none;
    --dxp-s-tertiary-button-text-color-1:var(--dxp-s-button-color-1);
    --dxp-g-info-contrast:#ffffff;
    --dxp-s-link-text-color:var(--dxp-g-brand);
    --dxp-s-text-heading-extra-extra-small-text-decoration:none;
    --dxp-g-neutral:#ecebea;
    --dxp-g-destructive-2:#611d1a;
    --dxp-g-destructive-3:#010000;
    --dxp-s-form-element-label-color:rgb(0, 0, 0);
    --dxp-s-text-heading-extra-large-font-weight:400;
    --dxp-s-text-heading-large-font-family:var(--dxp-s-html-font-family);
    --dxp-s-text-heading-extra-large-font-style:normal;
    --dxp-s-tertiary-button-text-color-active:var(--dxp-s-tertiary-button-text-color-focus);
    --dxp-s-text-heading-extra-small-text-transform:none;
    --dxp-s-text-heading-extra-small-font-weight:600;
    --dxp-s-form-element-text-font-size:1rem;
    --dxp-s-secondary-button-border-color-hover:var(--dxp-s-secondary-button-border-color-1);
    --dxp-s-button-large-padding:1.0rem;
    --dxp-g-info-2:#000000;
    --dxp-g-info-3:#000000;
    --dxp-s-secondary-button-border-color-focus:var(--dxp-s-secondary-button-border-color-1);
    --dxp-s-text-heading-medium-font-weight:400;
    --dxp-g-info-1:#0e203b;
    --dxp-g-neutral-contrast:#000000;
    --dxp-s-dropdown-color-background-hover:#FFF;
    --dxp-s-button-color:var(--dxp-g-brand);
    --dxp-g-neutral-3:#76716b;
    --dxp-g-neutral-2:#b2aeaa;
    --dxp-s-text-heading-extra-large-color:var(--dxp-g-root-contrast);
    --dxp-g-neutral-1:#d9d7d5;
    --dxp-s-secondary-button-color-1:var(--dxp-g-root-1);
    --dxp-g-success-contrast-3:#ffffff;
    --dxp-g-success-contrast-2:#ffffff;
    --dxp-s-text-heading-extra-large-font-size:2.875rem;
    --dxp-s-secondary-button-border-color-1:var(--dxp-s-button-color-1);
    --dxp-s-tertiary-button-color-focus:var(--dxp-s-tertiary-button-color-1);
    --dxp-s-form-element-caption-text-font-size:0.75rem;
    --dxp-s-form-element-spacing-horizontal-end:12px;
    --dxp-g-success-contrast-1:#000000;
    --dxp-s-component-wrapper-spacer-size:0.5rem;
    --dxp-s-button-large-padding-inline-end:1.0rem;
    --dxp-s-text-heading-extra-small-color:var(--dxp-g-root-contrast);
    --dxp-s-tertiary-button-text-color-hover:var(--dxp-s-tertiary-button-text-color-1);
    --dxp-s-link-text-decoration:none;
    --dxp-s-text-heading-medium-font-size:1.375rem;
    --dxp-s-form-element-label-text-decoration:none;
    --dxp-s-text-heading-extra-small-font-size:0.8125rem;
    --dxp-s-button-color-contrast:var(--dxp-g-brand-contrast);
    --dxp-s-button-padding-block-end:0.625rem;
    --dxp-s-section-columns-max-width-mobile:none;
    --dxp-s-text-heading-medium-color:var(--dxp-g-root-contrast);
    --dxp-s-button-small-padding:0.625rem;
    --dxp-s-text-heading-large-text-decoration:none;
    --dxp-s-form-element-caption-text-font-style:normal;
    --dxp-s-button-padding:0.75rem;
    --dxp-s-secondary-button-text-color-hover:var(--dxp-s-secondary-button-text-color-1);
    --dxp-s-text-heading-medium-font-family:var(--dxp-s-html-font-family);
    --dxp-s-footer-content-max-width:1800px;
    --dxp-s-text-heading-small-letter-spacing:0;
    --dxp-s-form-element-text-letter-spacing:0;
    --dxp-s-section-content-spacing-block-start-mobile:1.5rem;
    --dxp-g-brand-h:0;
    --dxp-g-brand-s:0%;
    --dxp-g-brand-l:11%;
    --dxp-g-brand-a:1.0;
    --dxp-s-dropdown-text-color-h:0;
    --dxp-s-dropdown-text-color-s:0%;
    --dxp-s-dropdown-text-color-l:11%;
    --dxp-s-dropdown-text-color-a:1.0;
    --dxp-g-info-h:216;
    --dxp-g-info-s:61%;
    --dxp-g-info-l:22%;
    --dxp-g-info-a:1.0;
    --dxp-g-root-h:0;
    --dxp-g-root-s:0%;
    --dxp-g-root-l:100%;
    --dxp-g-root-a:1.0;
    --dxp-s-form-element-color-border-h:216;
    --dxp-s-form-element-color-border-s:2%;
    --dxp-s-form-element-color-border-l:45%;
    --dxp-s-form-element-color-border-a:1.0;
    --dxp-g-warning-contrast-h:0;
    --dxp-g-warning-contrast-s:0%;
    --dxp-g-warning-contrast-l:0%;
    --dxp-g-warning-contrast-a:1.0;
    --dxp-s-form-element-color-background-h:0;
    --dxp-s-form-element-color-background-s:0%;
    --dxp-s-form-element-color-background-l:100%;
    --dxp-s-form-element-color-background-a:1.0;
    --dxp-g-offline-h:0;
    --dxp-g-offline-s:0%;
    --dxp-g-offline-l:27%;
    --dxp-g-offline-a:1.0;
    --dxp-g-warning-h:33;
    --dxp-g-warning-s:100%;
    --dxp-g-warning-l:68%;
    --dxp-g-warning-a:1.0;
    --dxp-s-dropdown-text-color-hover-h:216;
    --dxp-s-dropdown-text-color-hover-s:2%;
    --dxp-s-dropdown-text-color-hover-l:45%;
    --dxp-s-dropdown-text-color-hover-a:1.0;
    --dxp-g-destructive-contrast-h:0;
    --dxp-g-destructive-contrast-s:0%;
    --dxp-g-destructive-contrast-l:100%;
    --dxp-g-destructive-contrast-a:1.0;
    --dxp-g-brand-contrast-h:0;
    --dxp-g-brand-contrast-s:0%;
    --dxp-g-brand-contrast-l:100%;
    --dxp-g-brand-contrast-a:1.0;
    --dxp-s-form-element-color-border-focus-h:198;
    --dxp-s-form-element-color-border-focus-s:76%;
    --dxp-s-form-element-color-border-focus-l:38%;
    --dxp-s-form-element-color-border-focus-a:1.0;
    --dxp-s-tertiary-button-border-color-h:0;
    --dxp-s-tertiary-button-border-color-s:0%;
    --dxp-s-tertiary-button-border-color-l:0%;
    --dxp-s-tertiary-button-border-color-a:0.0;
    --dxp-g-destructive-h:2;
    --dxp-g-destructive-s:58%;
    --dxp-g-destructive-l:48%;
    --dxp-g-destructive-a:1.0;
    --dxp-s-dropdown-color-border-h:214;
    --dxp-s-dropdown-color-border-s:23%;
    --dxp-s-dropdown-color-border-l:88%;
    --dxp-s-dropdown-color-border-a:1.0;
    --dxp-g-offline-contrast-h:0;
    --dxp-g-offline-contrast-s:0%;
    --dxp-g-offline-contrast-l:100%;
    --dxp-g-offline-contrast-a:1.0;
    --dxp-g-success-h:146;
    --dxp-g-success-s:55%;
    --dxp-g-success-l:54%;
    --dxp-g-success-a:1.0;
    --dxp-g-root-contrast-h:0;
    --dxp-g-root-contrast-s:0%;
    --dxp-g-root-contrast-l:11%;
    --dxp-g-root-contrast-a:1.0;
    --dxp-s-tertiary-button-color-h:0;
    --dxp-s-tertiary-button-color-s:0%;
    --dxp-s-tertiary-button-color-l:0%;
    --dxp-s-tertiary-button-color-a:0.0;
    --dxp-g-success-contrast-h:0;
    --dxp-g-success-contrast-s:0%;
    --dxp-g-success-contrast-l:0%;
    --dxp-g-success-contrast-a:1.0;
    --dxp-g-info-contrast-h:0;
    --dxp-g-info-contrast-s:0%;
    --dxp-g-info-contrast-l:100%;
    --dxp-g-info-contrast-a:1.0;
    --dxp-g-neutral-h:30;
    --dxp-g-neutral-s:5%;
    --dxp-g-neutral-l:92%;
    --dxp-g-neutral-a:1.0;
    --dxp-s-form-element-label-color-h:0;
    --dxp-s-form-element-label-color-s:0%;
    --dxp-s-form-element-label-color-l:0%;
    --dxp-s-form-element-label-color-a:1.0;
    --dxp-g-neutral-contrast-h:0;
    --dxp-g-neutral-contrast-s:0%;
    --dxp-g-neutral-contrast-l:0%;
    --dxp-g-neutral-contrast-a:1.0;
    --dxp-s-dropdown-color-background-hover-h:0;
    --dxp-s-dropdown-color-background-hover-s:0%;
    --dxp-s-dropdown-color-background-hover-l:100%;
    --dxp-s-dropdown-color-background-hover-a:1.0;
    
}

/* Shared Dealer Connect layout, search filters and legal content. */
/* CRM search filters need labels above their placeholders, not Commerce floating labels. */
dxp_search-search-results lightning-input label.slds-form-element__label,
dxp_search-search-results lightning-input::part(label),
dxp_search-search-results lightning-combobox label.slds-form-element__label,
dxp_search-search-results lightning-combobox::part(label) {
    position: static !important;
    display: block;
    margin: 0 0 0.375rem;
    padding: 0 !important;
    font-size: var(--dxp-s-form-element-label-font-size, 1rem) !important;
    font-weight: var(--dxp-s-form-element-label-font-weight, 500);
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
    transform: none !important;
    transition: none;
}

dxp_search-search-results lightning-input div[part='input-text'],
dxp_search-search-results lightning-input::part(input-text) {
    min-height: 0;
    border: 0 !important;
    border-radius: 0;
}

dxp_search-search-results lightning-input .slds-input,
dxp_search-search-results lightning-input::part(input),
dxp_search-search-results lightning-combobox .slds-combobox__input,
dxp_search-search-results lightning-combobox::part(input),
dxp_search-search-results lightning-combobox::part(input-button) {
    box-sizing: border-box;
    min-height: 44px;
    padding: 0.5rem 12px !important;
    border: var(--dxp-s-form-element-width-border, 1px) solid var(--dxp-s-form-element-color-border, #707275) !important;
    border-radius: var(--dxp-s-form-element-radius-border, 20px);
}

dxp_search-search-results lightning-input .slds-input:focus,
dxp_search-search-results lightning-input::part(input):focus,
dxp_search-search-results lightning-combobox .slds-combobox__input:focus,
dxp_search-search-results lightning-combobox::part(input):focus,
dxp_search-search-results lightning-combobox::part(input-button):focus {
    border-color: var(--dxp-s-form-element-color-border-focus, #1c1c1c) !important;
    outline: 2px solid var(--dxp-s-form-element-color-border-focus, #1c1c1c);
    outline-offset: 2px;
}

/* CRM dropdowns use the same stacked label and single field border as text filters. */
dxp_search-search-results lightning-combobox lightning-base-combobox .slds-combobox__form-element {
    border: 0 !important;
    border-radius: 0;
}

dxp_search-search-results lightning-combobox lightning-base-combobox button.slds-combobox__input > span,
dxp_search-search-results lightning-combobox::part(input-button-value) {
    margin-top: 0 !important;
}

commerce-layout-site > .header,
commerce-my-account-my-account-layout > .header,
commerce_my_account-my-account-layout > .header,
community_layout-simple-theme-layout > header,
header:has(c-dealer-connect-header),
.header:has(c-dealer-connect-header),
community_layout-section:has(c-dealer-connect-header),
.comm-section-container:has(c-dealer-connect-header),
main:has(c-dealer-connect-hero),
community_layout-section:has(c-dealer-connect-hero),
.comm-section-container:has(c-dealer-connect-hero) {
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

commerce-layout-site > .header:has(c-dealer-connect-header),
commerce-my-account-my-account-layout > .header:has(c-dealer-connect-header),
commerce_my_account-my-account-layout > .header:has(c-dealer-connect-header),
community_layout-simple-theme-layout > header:has(c-dealer-connect-header),
body header:has(c-dealer-connect-header),
body .header:has(c-dealer-connect-header),
body community_layout-section:has(c-dealer-connect-header),
body .comm-section-container:has(c-dealer-connect-header) {
    position: sticky !important;
    top: 0 !important;
    inset-block-start: 0 !important;
    z-index: 900 !important;
    overflow: visible !important;
    background: var(--slds-g-color-surface-container-1, #fff) !important;
    border-bottom: 0.5px solid var(--slds-g-color-neutral-base-90, #e5e5e5) !important;
    box-shadow: none !important;
    pointer-events: auto;
}

body c-dealer-connect-header {
    --dealer-connect-header-position: relative;
    --dealer-connect-header-sticky-offset: 0;
    --dealer-connect-header-z-index: 900;
    --dealer-connect-header-host-pointer-events: auto;
    --dealer-connect-header-content-pointer-events: auto;
    --dealer-connect-header-row-box-sizing: border-box;
    --dealer-connect-header-row-padding-block: 0;
    --dealer-connect-header-mobile-row-padding-block: 0;
    --dealer-connect-header-font-family: var(
        --slds-g-font-family,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        "Helvetica Neue",
        Arial,
        sans-serif
    );
    /* Matches the Dealer Connect desktop content width configured in site branding. */
    --dealer-connect-header-max-content-width: 1800px;
    --dealer-connect-header-logo-height: 17px;
    --dealer-connect-header-nav-font-weight: var(--slds-g-font-weight-4, 400);
    --dealer-connect-header-desktop-nav-offset: var(--slds-g-spacing-2, 0.5rem);
}

commerce-my-account-my-account-layout:has(.dealerConnectProfilePage) > main,
commerce_my_account-my-account-layout:has(.dealerConnectProfilePage) > main {
    box-sizing: border-box;
    width: 100%;
    max-width: 1800px;
    margin-inline: auto;
}

html[data-dealer-connect-walkthrough-open='true'] body c-dealer-connect-header {
    --dealer-connect-header-z-index: 0;
}

commerce-layout-site > .header::before,
commerce-layout-site > .header::after,
commerce-my-account-my-account-layout > .header::before,
commerce-my-account-my-account-layout > .header::after,
commerce_my_account-my-account-layout > .header::before,
commerce_my_account-my-account-layout > .header::after,
community_layout-simple-theme-layout > header::before,
community_layout-simple-theme-layout > header::after,
header:has(c-dealer-connect-header)::before,
header:has(c-dealer-connect-header)::after,
.header:has(c-dealer-connect-header)::before,
.header:has(c-dealer-connect-header)::after {
    content: none !important;
    display: none !important;
}

.dealerConnectSectionHeader.dealerConnectSectionHeader--secondary {
    margin-bottom: var(--slds-g-spacing-3, 0.75rem);
}

.dealerConnectActionGroup.dealerConnectActionGroup--primary,
.dealerConnectActionGroup.dealerConnectActionGroup--secondary {
    margin: 0 0 var(--slds-g-spacing-2, 0.5rem);
}

.dealerConnectLegalUpdated {
    box-sizing: border-box;
    width: 100%;
    margin: calc(-1 * var(--slds-g-spacing-4, 1rem)) 0 var(--slds-g-spacing-6, 2rem);
    padding: 0 var(--slds-g-spacing-5, 1.5rem) !important;
    color: var(--slds-g-color-on-surface-1, #5c5c5c);
    font-size: var(--slds-g-font-scale-neg-1, 0.75rem);
    font-weight: var(--slds-g-font-weight-4, 400);
    line-height: var(--slds-g-font-lineheight-2, 1.25);
}

.dealerConnectLegalUpdated strong {
    font-weight: inherit;
}

.dealerConnectLegalContent {
    box-sizing: border-box;
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 var(--slds-g-spacing-5, 1.5rem) var(--slds-g-spacing-8, 3rem) !important;
    color: var(--slds-g-color-on-surface-2, #2e2e2e) !important;
    font-size: var(--slds-g-font-scale-2, 1rem) !important;
    line-height: 1.6 !important;
}

.dealerConnectLegalContent h2 {
    margin: var(--slds-g-spacing-6, 2rem) 0 var(--slds-g-spacing-3, 0.75rem) !important;
    color: var(--slds-g-color-on-surface-3, #03234d) !important;
    font-size: var(--slds-g-font-scale-3, 1.25rem) !important;
    font-weight: var(--slds-g-font-weight-6, 600) !important;
    line-height: var(--slds-g-font-lineheight-3, 1.375) !important;
}

.dealerConnectLegalContent h2:first-child {
    margin-top: 0 !important;
}

.dealerConnectLegalContent h2 strong {
    font-weight: inherit;
}

.dealerConnectLegalContent p {
    margin: 0 0 var(--slds-g-spacing-4, 1rem) !important;
}

.dealerConnectLegalContent ul,
.dealerConnectLegalContent ol {
    margin: 0 0 var(--slds-g-spacing-4, 1rem) !important;
    padding-inline-start: var(--slds-g-spacing-5, 1.5rem) !important;
}

.dealerConnectLegalContent li {
    margin: 0 !important;
    padding-inline-start: var(--slds-g-spacing-1, 0.25rem) !important;
}

.dealerConnectLegalContent li + li {
    margin-top: var(--slds-g-spacing-2, 0.5rem) !important;
}

.dealerConnectLegalContent a {
    color: var(--slds-g-color-accent-2, #0250d9);
    overflow-wrap: anywhere;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.dealerConnectLegalContent a:hover {
    color: var(--slds-g-color-accent-3, #022ac0);
}

.dealerConnectLegalContent a:focus-visible {
    border-radius: var(--slds-g-radius-border-1, 0.25rem);
    outline: none;
    box-shadow:
        0 0 0 2px var(--slds-g-color-surface-2, #f3f3f3),
        0 0 0 4px var(--slds-g-color-brand-base-15, #001e5b);
}

@media (max-width: 47.99em) {
    .dealerConnectLegalUpdated {
        padding-right: var(--slds-g-spacing-4, 1rem) !important;
        padding-left: var(--slds-g-spacing-4, 1rem) !important;
    }

    .dealerConnectLegalContent {
        padding-right: var(--slds-g-spacing-4, 1rem) !important;
        padding-left: var(--slds-g-spacing-4, 1rem) !important;
    }
}

/* Shared Quick Start, native record controls, profile and checkout presentation. */
:root {
    --com-c-checkout-section-accordion-separators-border-bottom-width: 0px;
    --com-c-checkout-section-accordion-separators-border-bottom-style: none;
    --com-c-checkout-section-accordion-separators-border-bottom-color: transparent;
}

/* Shared Dealer Connect Quick Start heading and color-only hover contract. */
.dealerConnectSectionHeader.dealerConnectSectionHeader--primary {
    padding: 20px;
    border-radius: 10px 10px 0 0;
    background-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    color: var(--slds-g-color-neutral-base-100, #ffffff);
    text-align: center;
}

.dealerConnectSectionHeader.dealerConnectSectionHeader--secondary {
    padding: 20px;
    border-bottom: var(--slds-g-sizing-border-2, 2px) solid var(--slds-g-color-neutral-base-20, rgba(0, 0, 0, 0.8));
    color: var(--slds-g-color-neutral-base-20, rgba(0, 0, 0, 0.8));
    text-align: center;
}

.dealerConnectSectionHeader.dealerConnectSectionHeader--primary .dealerConnectSectionHeader__title,
.dealerConnectSectionHeader.dealerConnectSectionHeader--secondary .dealerConnectSectionHeader__title {
    margin: 0;
    font-size: 18px;
    font-weight: var(--slds-g-font-weight-7, 700);
    line-height: var(--slds-g-font-lineheight-2, 1.25);
}

.dealerConnectSectionHeader.dealerConnectSectionHeader--primary .dealerConnectSectionHeader__label,
.dealerConnectSectionHeader.dealerConnectSectionHeader--secondary .dealerConnectSectionHeader__label {
    font-weight: var(--slds-g-font-weight-7, 700);
}

.dealerConnectActionGroup.dealerConnectActionGroup--primary,
.dealerConnectActionGroup.dealerConnectActionGroup--secondary {
    width: 100%;
    overflow: visible;
}

.dealerConnectActionGroup.dealerConnectActionGroup--primary a.dealerConnectButton,
.dealerConnectActionGroup.dealerConnectActionGroup--secondary a.dealerConnectButton {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-height: calc(var(--slds-g-sizing-9, 2rem) + var(--slds-g-spacing-2, 0.5rem));
    padding: calc(var(--slds-g-spacing-2, 0.5rem) + 2px) var(--slds-g-spacing-4, 1rem);
    border: var(--slds-g-sizing-border-2, 2px) solid var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    border-radius: var(--slds-g-radius-border-pill, 15rem);
    outline: 0;
    box-shadow: none;
    font-size: var(--slds-g-font-size-base, 0.8125rem);
    font-weight: var(--slds-g-font-weight-4, 400);
    line-height: var(--slds-g-font-lineheight-1, 1);
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    user-select: none;
    touch-action: manipulation;
    transition:
        background-color 180ms cubic-bezier(0.2, 0, 0.2, 1),
        border-color 180ms cubic-bezier(0.2, 0, 0.2, 1),
        color 180ms cubic-bezier(0.2, 0, 0.2, 1);
}

.dealerConnectActionGroup a.dealerConnectButton *,
.dealerConnectActionGroup a.dealerConnectButton *::before,
.dealerConnectActionGroup a.dealerConnectButton *::after {
    -webkit-user-drag: none;
    -webkit-user-select: none;
    user-select: none;
}

.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--primary,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--primary:link,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--primary:visited,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--launch,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--launch:link,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--launch:visited {
    border-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    background-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    color: var(--slds-g-color-neutral-base-100, #ffffff);
    -webkit-text-fill-color: var(--slds-g-color-neutral-base-100, #ffffff);
    text-decoration: none;
}

.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--secondary,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--secondary:link,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--secondary:visited {
    border-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    background-color: var(--slds-g-color-neutral-base-100, #ffffff);
    color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    -webkit-text-fill-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    text-decoration: none;
}

.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--primary:hover,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--primary:focus,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--launch:hover,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--launch:focus {
    border-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    background-color: var(--slds-g-color-neutral-base-100, #ffffff);
    color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    -webkit-text-fill-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    text-decoration: none;
}

.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--secondary:hover,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--secondary:focus {
    border-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    background-color: var(--slds-g-color-neutral-base-10, rgb(24, 24, 24));
    color: var(--slds-g-color-neutral-base-100, #ffffff);
    -webkit-text-fill-color: var(--slds-g-color-neutral-base-100, #ffffff);
    text-decoration: none;
}


.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--primary:focus-visible,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--secondary:focus-visible,
.dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--launch:focus-visible {
    outline: 0;
    box-shadow:
        0 0 0 2px var(--slds-g-color-surface-2, #f3f3f3),
        0 0 0 4px var(--slds-g-color-brand-base-15, #001e5b);
}

.dealerConnectActionGroup a.dealerConnectButton[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.7;
    pointer-events: none;
    box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
    .dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--primary,
    .dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--secondary,
    .dealerConnectActionGroup a.dealerConnectButton.dealerConnectButton--launch {
        transition: none;
    }

}

dxp_content_layout-record-list-layout lightning-input.slds-form-element div[part='input-text'] .slds-form-element__label {
    top: 0px;
}

dxp_content_layout-record-list-layout .slds-button_brand,
dxp_content_layout-record-list-layout .slds-button--brand {
    border: none;
    outline: none;
}

/* Profile read-only controls. */
.dealerConnectProfileActions.dealerConnectProfileActions--readOnly .slds-button_neutral,
.dealerConnectProfileActions.dealerConnectProfileActions--readOnly .slds-button_outline-brand,
.dealerConnectProfileActions.dealerConnectProfileActions--readOnly .slds-pill {
    display: none;
}

/* Shared authentication layout, including Ordering's existing override strength. */
/* Dealer Connect unified auth page layout. */
html:has(.dealerConnectUnifiedAuthSection),
body:has(.dealerConnectUnifiedAuthSection) {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

community_layout-simple-theme-layout:has(.dealerConnectUnifiedAuthSection) {
    width: 100% !important;
    min-height: 100dvh !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
}

community_layout-simple-theme-layout:has(.dealerConnectUnifiedAuthSection) > header,
community_layout-simple-theme-layout:has(.dealerConnectUnifiedAuthSection) > footer {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

community_layout-simple-theme-layout:has(.dealerConnectUnifiedAuthSection) > main {
    display: block !important;
    width: 100% !important;
    min-height: 100dvh !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.comm-section-container.dealerConnectUnifiedAuthSection {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100dvh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 16px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.comm-section-container.dealerConnectUnifiedAuthSection .columns-content,
.comm-section-container.dealerConnectUnifiedAuthSection community_layout-column,
.comm-section-container.dealerConnectUnifiedAuthSection .column-content {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: calc(100dvh - 32px) !important;
    height: calc(100dvh - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.comm-section-container.dealerConnectUnifiedAuthSection .dealerConnectUnifiedAuthMount,
.comm-section-container.dealerConnectUnifiedAuthSection c-dealer-connect-unified-auth {
    display: block !important;
    width: min(360px, calc(100vw - 32px)) !important;
    max-width: calc(100vw - 32px) !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

@media (max-width: 767px) {
    .comm-section-container.dealerConnectUnifiedAuthSection {
        padding: 12px !important;
    }

    .comm-section-container.dealerConnectUnifiedAuthSection .columns-content,
    .comm-section-container.dealerConnectUnifiedAuthSection community_layout-column,
    .comm-section-container.dealerConnectUnifiedAuthSection .column-content {
        min-height: calc(100dvh - 24px) !important;
        height: calc(100dvh - 24px) !important;
        max-height: calc(100dvh - 24px) !important;
    }

    .comm-section-container.dealerConnectUnifiedAuthSection .dealerConnectUnifiedAuthMount,
    .comm-section-container.dealerConnectUnifiedAuthSection c-dealer-connect-unified-auth {
        width: min(360px, calc(100vw - 24px)) !important;
        max-width: calc(100vw - 24px) !important;
    }
}