/* CSS Structure */

/* 1. Variables */
/* 2. Example Attribute Order */
/* 3. Salesforce Overrides */
/* 4. Standard Styles */
/* 4.1. Heading */
/* 4.2. Border */
/* 4.3. Padding */
/* 4.4. Buttons */
/* 4.5. Inputs */
/* 4.6. Outputs */
/* 4.7. Grids */
/* 4.8. Other Standard Styles */
/* 4.9. Login Page */

/* 5. Shop Standard Styles */
/* 6. Shop Main Components */
/* 6.0.1 Shop Start */
/* 6.1. Shop Header */
/* 6.2. Shop Search Main */
/* 6.2.1 Shop Search Breadcrumbs */
/* 6.3. Shop Search Bar */
/* 6.4. Shop Search Result */
/* 6.5. Shop Search Result Column, Shop Items */
/* 6.6. Shop Checkout */
/* 6.7. Shop Overlay */
/* 6.8. Shop Cart */
/* 6.9. Shop Search Filter */
/* 6.91. Shop Confirmation Page */
/* 6.92. Shop Detail */
/* 6.92.1 Shop Detail Carousel */
/* 6.92.2 Shop Detail Rec Carousel */

/* 7. Media queries */

/* 15. MD Standard Styles */
/* 16. MD Main Components */

/* 99. Header */
/* 99.1 Header - Logo */


/* Variables Style Definition */
/* in Brand specific css files */


/* ***** CSS Attribute Order Example ***** */
.example {
    /* Positioning */
    position: absolute;
    z-index: 10;
    top: 0;
    right: 0;

    /* Display & Box Model */
    display: inline-block;
    overflow: hidden;
    box-sizing: border-box;
    width: 100px;
    height: 100px;
    padding: 10px;
    border: 10px solid #333;
    margin: 10px;

    /* Color */
    background: #000;
    color: #fff;
    /* Text */
    font-family: sans-serif;
    font-size: 16px;
    line-height: 1.4;
    text-align: right;

    /* Other */
    cursor: pointer;
}

/* ***** Salesforce overrides ***** */
.slds-col--padded.comm-content-footer.comm-layout-column {
    padding: 0px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;

}

.slds-file-selector_files .slds-file-selector__text,
.slds-file-selector--files .slds-file-selector__text {
    margin: 0px !important;
}

.slds-table th {
    position: sticky;
    top: 0;
}

.cb-section_column {
    padding: 0px !important;
}

div.forceContentPreviewerActionsBar:nth-child(2) {
    display: none;
}

div.forceContentPreviewerActionsBar:nth-child(3) {
    display: none;
}

div.forceContentPreviewerActionsBar:nth-child(4) {
    display: none;
}

div.popupTargetContainer a button:nth-child(2) {
    /*display: none;*/
}

.toastMessage.forceActionsText {
    white-space: pre-line !important;
}

.shop-product-detail-checklist-advantages .slds-icon-action-check {
    padding: 4px;
    margin-right: 15px;
    width: 24px;
    height: 24px;
}

.shop-product-detail-checklist-advantages.slds-icon_xx-small,
.shop-product-detail-checklist-advantages.slds-icon--xx-small {
    width: var(--lwc-squareIconXxSmallContent, .5);
    height: var(--lwc-squareIconXxSmallContent, .5);
    line-height: var(--lwc-lineHeightReset, 1);

}

/* ***** Standard Styles ***** */
html,
body {
    font-family: var(--font-family-Light);
    font-size: var(--Paragraph-big-font-size);
}

p {
    font-size: var(--Paragraph-big-font-size);
    color: var(--text-color);
}

p small {
    font-size: var(--Paragraph-small-font-size);
}

b,
p b {
    font-weight: var(--font-weight-500);
}

:root {
    /** set the font for all root/body text **/
    --dxp-g-root-font-family: 'Roboto-Light', sans-serif;

    /** set the font for headings **/
    --dxp-g-heading-font-family: 'Roboto-Light', sans-serif;
}

body {
    font-family: var(--font-family-Light) !important;
}

p {
    font-family: var(--font-family-Normal) !important;
    font-weight: 300;
    letter-spacing: .05rem;
}

button {
    transition: 0.3s;
    font-family: var(--font-family-Normal);
    font-weight: 500;
    letter-spacing: 0.05rem;
}

input {
    outline: none !important;
    color: var(--text-color) !important;
}

button:disabled {
    opacity: 0.5;
}

a {
    color: var(--brand-color);
}

/* ***** Heading ***** */
body h1 {
    font-family: var(--font-family-Light);
    font-size: var(--h1-font-size);
    font-weight: var(--font-weight-300);
    color: var(--text-color);
}

body h2 {
    font-family: var(--font-family-Normal);
    font-size: var(--h2-font-size);
    font-weight: var(--font-weight-300);
    color: var(--text-color);
}

body h3 {
    font-family: var(--font-family-Normal) !important;
    font-size: var(--h3-font-size) !important;
    font-weight: var(--font-weight-400) !important;
    color: var(--text-color);
}

body h4 {
    font-family: var(--font-family-Normal);
    font-size: var(--h4-font-size);
    font-weight: var(--font-weight-300);
    color: var(--text-color);
}

.shop-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    text-wrap: nowrap;
    display: flex;
}

td {
    color: var(--text-color);
}

/* ***** border ***** */
.shop-border-brand {
    border: var(--border-brand);
}

.shop-border-brand {
    border: var(--border-brand);
}

.shop-border-bottom {
    border-bottom: var(--border-dark);
}

.shop-border-top {
    border-top: var(--border-dark);
}

/* ***** padding ***** */
/* p-x-large */
.shop-p-top-x-large {
    padding-top: var(--p-m-x-large);
}

.shop-p-bottom-x-large {
    padding-bottom: var(--p-m-x-large);
}

.shop-p-left-x-large {
    padding-left: var(--p-m-x-large);
}

.shop-p-right-x-large {
    padding-right: var(--p-m-x-large);
}

.shop-p-around-x-large {
    padding: var(--p-m-x-large);
}

/* p-large */
.shop-p-top-large {
    padding-top: var(--p-m-large);
}

.shop-p-bottom-large {
    padding-bottom: var(--p-m-large);
}

.shop-p-left-large {
    padding-left: var(--p-m-large);
}

.shop-p-right-large {
    padding-right: var(--p-m-large);
}

.shop-p-around-large {
    padding: var(--p-m-large);
}

/* p-medium */
.shop-p-top-medium {
    padding-top: var(--p-m-medium);
}

.shop-p-bottom-medium {
    padding-bottom: var(--p-m-medium);
}

.shop-p-left-medium {
    padding-left: var(--p-m-medium);
}

.shop-p-right-medium {
    padding-right: var(--p-m-medium);
}

.shop-p-around-medium {
    padding: var(--p-m-medium);
}

.shop-p-bottom-medium {
    padding-bottom: var(--p-m-medium);
}

/* p-small */
.shop-p-top-small {
    padding-top: var(--p-m-small);
}

.shop-p-bottom-small {
    padding-bottom: var(--p-m-small);
}

.shop-p-left-small {
    padding-left: var(--p-m-small);
}

.shop-p-right-small {
    padding-right: var(--p-m-small);
}

.shop-p-around-small {
    padding: var(--p-m-small);
}

/* p-x-small */
.shop-p-top-x-small {
    padding-top: var(--p-m-x-small);
}

.shop-p-bottom-x-small {
    padding-bottom: var(--p-m-x-small);
}

.shop-p-left-x-small {
    padding-left: var(--p-m-x-small);
}

.shop-p-right-x-small {
    padding-right: var(--p-m-x-small);
}

.shop-p-around-x-small {
    padding: var(--p-m-x-small);
}

/* text-colors */

.shop-text-color {
    color: var(--text-color);
}

/* other text-styles */
.shop-text-center {
    text-align: center;
}

.shop-text-left {
    text-align: left;
}

.shop-text-right {
    text-align: right;
}

.shop-text-big {
    font-size: var(--Paragraph-big-font-size);
}

button:disabled {
    cursor: default;
}

/* Shop Buttons  */
.shop-button {
    font-family: var(--font-family-Normal);
    /* Positioning */
    position: relative;
    /* Display & Box Model */
    align-items: center;
    width: 100%;
    max-width: 500px;
    padding-left: 0%;
    padding-right: 0%;
    border-radius: var(--button-border-radius);
    /* Text */
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-500);
    line-height: var(--button-line-height);
    text-align: center;
    letter-spacing: 0.05rem
}

/* Button Call To Action */
.shop-button-action {
    /* Display & Box Model */
    border: 1px solid var(--CTA-button-color);
    /* Color */
    background-color: var(--CTA-button-color);
    color: var(--background-color);
    padding: 0px 20px;
}

.shop-button-action:hover {
    /* Display & Box Model */
    border: 1px solid var(--CTA-button-color);
    /* Color */
    background-color: white;
    color: var(--CTA-button-color);
}

/* Button Call To Action Inverse */
.shop-button-action-inverse {
    /* Display & Box Model */
    border: 1px solid var(--CTA-button-color);
    /* Color */
    background-color: var(--background-color-white);
    color: var(--CTA-button-color);
}

.shop-button-action-inverse:hover {
    border: 1px solid var(--CTA-button-color);
    background-color: var(--CTA-button-color);
    color: var(--background-color);
}

/* Button Brand */

.shop-button-brand:disabled:hover,
.shop-button-brand {
    border: 1px solid var(--brand-color);
    background-color: var(--brand-color);
    color: var(--background-color-white);

}

.shop-button-brand:hover {
    background-color: var(--background-color-white);
    color: var(--brand-color);
    border-color: var(--brand-color);
}

/* Button Brand Inverse */
.shop-button-brand-inverse {
    border: 1px solid var(--brand-color);
    background-color: var(--background-color-white);
    color: var(--brand-color);

}

.shop-button-brand-inverse:hover {
    background-color: var(--brand-color);
    color: var(--background-color-white);
}

.shop-button-brand-inverse-dashed {
    border: 1px dashed var(--brand-color);
    background-color: var(--background-color-white);
    color: var(--brand-color);

}

.shop-button-brand-inverse-dashed:hover {
    background-color: var(--brand-color);
    color: var(--background-color-white);
}

/* ***** Shop Inputs ***** */
.custom-input {
    /* Display & Box Model */
    height: 46px;
    width: 100%;
    padding: 0 1rem 0 0.75rem;
    border: solid var(--brand-color) 1px;
    border-radius: var(--border-radius-default);
    box-shadow: none !important;
    font-size: var(--Paragraph-medium-font-size);
    letter-spacing: 0.05rem;

}

.custom-input:focus {
    box-shadow: none !important;
}

/* input with icon */

.shop-search-bar .icon-spacing {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 24px;
}

.shop-search-bar .custom-input {
    width: calc(100% - 70px);
    max-width: 800px;
    margin-top: 20px;
    margin-bottom: 15px;
    margin-right: 25px;
    margin-left: 25px;
    min-width: 320px;
}

.shop-search-main .shop-search-bar .custom-input {
    font-size: var(--Paragraph-big-font-size);
    outline: none;
}

.shop-search-main .shop-output-value .shop-output-title,
.shop-search-main .shop-output-value {
    font-size: var(--Paragraph-medium-font-size);
}



input[type="checkbox"] {
    position: absolute;
    height: 20px;
    width: 20px;
    margin-right: 10px;
    margin-top: 4px;
    border-radius: var(--border-radius-default);
    border: var(--border-brand);
    accent-color: var(--brand-color);
    /* outline: 1px solid var(--brand-color); */
}

/* input Combobox */
.multi-select-combobox__dropdown {
    max-height: 500px;
}

.multi-select-combobox__input {
    display: inline-block;
    width: 100%;
    height: 46px;
    min-height: calc(1.875rem + (1px * 2));
    padding: 0 1rem 0 0.75rem;
    border: solid var(--brand-color) 1px !important;
    border-radius: var(--border-radius-default);
    background-color: var(--background-color);
    line-height: 1.875rem;
    cursor: pointer;
    transition: border 0.1s linear, background-color 0.1s linear;
    box-shadow: none !important;
    /* max-width: 70px; */
    font-size: var(--Paragraph-medium-font-size) !important;
    letter-spacing: 0.05rem;
}

.slds-input-has-icon .slds-input__icon {
    margin-top: -10px !important;
    right: 5px !important;
}

.multi-select-combobox__input:disabled {
    border: 1px solid #c9c7c5;
    background-color: #ecebea;
}

.multi-select-combobox__icon {
    margin-right: 10px;
}

.slds-combobox.slds-picklist .slds-dropdown {
    width: 100% !important;
    box-shadow: none;

}

.slds-picklist input[readonly] {
    color: var(--text-color);
}

.slds-listbox__item:hover {
    background-color: var(--brand-color-light);
}


.slds-combobox.slds-picklist .slds-dropdown .slds-align_absolute-center {
    justify-content: left;
    margin-left: 15px;
    box-shadow: none;
}

.shop-item-row-edit-Unit .icon {
    top: 2.7rem;
    display: inline-block;
    width: 26px;
    height: 26px;
    margin-top: -5px;
    margin-right: 2.3vw !important;
    border: 0;
    background-repeat: no-repeat;
    background-size: 85% 85%;
    background-image: var(--shop-item-row-edit-Unit-icon);
    cursor: pointer;
}

/* Search Box */
.shop-search-box {
    position: relative;
    height: 132px;
    overflow: hidden;
    border: var(--border-brand);
    border-radius: var(--border-radius-default);
}

.shop-search-box .shop-box-display-item {
    padding: var(--p-m-medium);
}

.shop-search-box-items {
    display: none;
}

.shop-search-box-items.shop-search-box-items-active {
    display: block;
    overflow-y: auto !important;
    min-height: 120px;
    max-height: 345px;
    border: var(--border-brand);
    border-radius: var(--border-radius-default);
}

.shop-search-box-items a p,
.shop-search-box a p {
    font-family: var(--font-family-Light) !important;
    font-weight: var(--font-weight-300);
    color: var(--text-color);
    font-size: var(--Paragraph-medium-font-size);
}

.shop-search-box-items a:hover,
.shop-search-box a:hover {
    text-decoration: none;
    font-family: var(--font-family-Light) !important;
    font-weight: var(--font-weight-300);
    color: var(--text-color);
}

.shop-search-box-items a .shop-box-item:hover,
.shop-search-box a .shop-box-item:hover {
    background: var(--background-color);
}

.shop-search-box-items a .shop-box-item,
.shop-search-box a .shop-box-item {
    padding: var(--p-m-medium);
    border-bottom: var(--border-light);
}

.shop-search-box-items a p .shop-bold,
.shop-search-box a p .shop-bold {
    font-family: var(--font-family-Normal) !important;
    font-weight: var(--font-weight-500);
}

.shop-search-box .shop-search-box-icon {}

.shop-search-box .shop-icon-position {
    position: absolute;
    right: 0px;
    z-index: 5;
}

.shop-search-box .icon {
    top: 2.7rem;

    display: inline-block;
    width: 26px;
    height: 26px;
    margin-top: 5px;
    /*margin-right: 2.3vw !important;*/
    border: 0;
    background-repeat: no-repeat;
    background-size: 85% 85%;
    background-image: var(--shop-search-box-icon);
    cursor: pointer;
}

.shop-search-box-small-text {
    font-size: var(--Paragraph-small-font-size);
    color: var(--text-color);
}

/* Outputs */
.shop-output-title {
    display: inline-block;
    width: 120px;
    font-family: var(--font-family-Normal) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-500);
    color: var(--text-color);
    flex-shrink: 0;

}

.shop-search-main .shop-output-title,
.shop-cart-main .shop-output-title,
.shop-checkout-main .shop-output-title {
    overflow: hidden;
    text-overflow: ellipsis;
    text-wrap: nowrap;
}


.shop-output-value {
    display: flex;
    gap: 20px;
    /* margin-left: 20px;
    margin-right: 20px; */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
    color: var(--text-color);
}

.shop-checkout-main .shop-output-value {
    align-items: center;
}

.shop-output-value-cart-silo-technic {
    overflow: visible !important;
    gap: 20px;
}

.shop-cart-silo-position-wrapper {
    /* margin-left: 20px; */
    margin-top: 5px;
}

.shop-cart-silo-position-name-output {
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
}

.shop-cart-silo-position-amount-output-wrapper {
    display: flex;
}

.shop-cart-silo-position-amount-title {
    margin-right: 5px;
    font-family: var(--font-family-Normal) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-500);
}

.shop-cart-silo-position-headline {
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    /* margin-left: 20px; */
}


/* Grids */
.shop-grid {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.shop-grid-search-main {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 40px;
    row-gap: 34px;
}

.shop-grid-direction-col-center {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.shop-grid-direction-row-center {
    align-items: center;
    justify-content: center;
}

.shop-grid-col,
.shop-grid-col-2,
.shop-grid-col-3,
.shop-grid-col-4,
.shop-grid-col-6,
.shop-grid-col-8,
.shop-grid-col-10,
.shop-grid-col-12,
.shop-grid-col-carousel,
.shop-grid-col-self-service {
    width: 100%;
    position: relative;
}

/* other Standard Styles  */
.shop-float-right {
    float: right;
}

.shop-box-success {
    border: var(--border-success);
    background: var(--success-background-light-color);
}

/* 4.9. Login Page */
.my-shop-login-page-content-wrapper {
    display: flex;
    width: 100%;
    height: 100vh;
    background-color: var(--background-color);
}

.my-shop-login-page-form-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.my-shop-login-page-image-wrapper {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #cccccc;
    /* Placeholder background color */
}

.placeholder-image {
    width: 80%;
    height: 80%;
    background-color: #999999;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 24px;
}

.my-shop-login-page-icon-circle {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: var(--brand-color);
    overflow: hidden;
}

.my-shop-login-page-icon {
    height: 50px;
    width: 50px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: var(--my-shop-login-page-icon);
}

.my-shop-login-page-title {
    padding-top: 50px;
    font-family: var(--font-family-Normal) !important;
    font-size: var(--h2-font-size);
    font-weight: var(--font-weight-500);
    color: black;
    text-align: center;
    width: 350px;
}

.my-shop-login-page-subtitle {
    padding-top: 20px;
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
    color: black;
    text-align: center;
    width: 350px;
}

.my-shop-login-page-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.my-shop-login-page-form input {
    width: 80%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.my-shop-login-page-form button {
    width: 80%;
    padding: 10px;
    margin: 10px 0;
    background-color: var(--brand-color);
    border: none;
    border-radius: 5px;
    color: white;
    font-size: 16px;
    cursor: pointer;
}

.my-shop-login-page-links {
    text-align: center;
    width: 80%;
    margin-top: 20px;
}

.my-shop-login-page-links a {
    display: block;
    margin-bottom: 10px;
    color: var(--brand-color);
}

.my-shop-login-page-contact-buttons {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

.my-shop-login-page-phone-button,
.my-shop-login-page-email-button {
    margin: 0 10px;
    padding: 10px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.my-shop-login-page-phone-button {
    background-color: green;
    color: white;
}

.my-shop-login-page-email-button {
    background-color: blue;
    color: white;
}

.my-link {
    color: var(--brand-color);
    text-decoration: none;
    -webkit-hyphens: none;
    hyphens: none;
    border: none;
    padding: 0px;
    background: transparent;
    font-weight: var(--font-weight-500);
    font-family: var(--font-family-Normal);
}

.my-link:hover {
    text-decoration: underline;
    color: var(--brand-color);
}

.my-link:after {
    position: relative;
    bottom: .15em;
    display: inline-block;
    width: .3em;
    height: .3em;
    content: "";
    border-width: .08em .08em 0 0;
    border-style: solid;
    left: .3em;
    transform: rotate(45deg);
    border-color: var(--brand-color);
}

.my-link-white {
    color: white;
    text-decoration: underline;
    -webkit-hyphens: none;
    hyphens: none;
    border: none;
    padding: 0px;
    background: transparent;
    font-weight: var(--font-weight-500);
    font-family: var(--font-family-Normal);
}

.my-link-white:hover {
    text-decoration: none;
    color: white;
}

.my-link-white:after {
    position: relative;
    bottom: .15em;
    display: inline-block;
    width: .3em;
    height: .3em;
    content: "";
    border-width: .08em .08em 0 0;
    border-style: solid;
    left: .3em;
    transform: rotate(45deg);
    border-color: white;
}

/* ***** Shop Standard Styles ***** */
.shop-overlay-background {
    /* Positioning */
    position: fixed;
    z-index: 3;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    /* Display & Box Model */
    /* Color */
    background: rgba(243, 243, 243, .5);
    /* Text */
    /* Other */
}

.shop-navigation {
    font-size: var(--navigation-font-size);
    font-weight: var(--font-weight-400);
}

/* ***** Shop Main Components ***** */

/*.shop-confirmation-main,
.shop-checkout-main,
.shop-detail-main {
    max-width: 1440px;
    margin: 0 auto 0 auto;
    padding: 0 auto;
}*/

.shop-content-main {
    max-width: 1340px;
    margin: 0 auto 0 auto;
    padding: 0 50px;
    padding-bottom: 40px;
}

.self-service-main,
.shop-detail-main,
.shop-confirmation-main,
.shop-checkout-main,
.shop-start-content-wrapper,
.shop-search-content-wrapper,
.md-main,
.shop-product-detail-rec-carousel-wrapper-boundary>.my-carousel-wrapper {
    max-width: 1340px;
    margin: 0 auto 0 auto;
    padding: 0 50px;
    padding-bottom: 40px;
    margin-top: 130px;
    letter-spacing: 0.05rem;
}

.my-home-main-content-wrapper {
    margin: 0px auto 0 auto;
    max-width: 1340px;
    padding: 0 50px;
}

.shop-start-content-wrapper {
    margin-top: 0px;
}

.shop-search-content-wrapper {
    margin-top: 50px;
}

.shop-confirmation-content {
    max-width: 1440px;
    margin: 0 auto 0 auto;
    padding: 0 auto;
}

/* Shop Start - Site */

.shop-start-header {
    margin-top: 30px;
}

.shop-start-button-section {
    padding: 25px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.shop-start-button-section .shop-button-action {
    max-width: 300px;
}

.shop-start-main .shop-start-header {
    min-height: 299px;
    width: 100%;
    text-align: center;
    /*background-color: var(--background-color);*/
    background-image: var(--shop-start-header-icon);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.shop-start-header-background {
    padding: 20px;
    margin: auto;
    min-height: 250px;

    text-align: center;
    background-color: rgba(255, 255, 255, 0.9);
    background-clip: content-box, padding-box;
}



.shop-start-main .shop-start-header-text {
    padding-top: 10px;
    padding-bottom: 20px;
    color: var(--text-color);

}

.shop-start-main .shop-start-sub-header-text {
    padding: 0 20px;
    color: var(--text-color);
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
    max-width: 606px;
    display: inline-block;
}

.shop-start-main .shop-start-main-placeholder {
    padding-top: 10px;
    padding-bottom: 10px;
}

.shop-silo-info-wrapper {
    display: flex;
    justify-content: space-around;
    border: 1px solid var(--brand-color);
    align-items: center;
    position: relative;
}

.shop-silo-info-wrapper .shop-shipping-content {
    border: none !important;
}

.shop-silo-info-detail-wrapper {
    border: none;
}

.shop-silo-info-detail-wrapper {
    border: 1px solid var(--brand-color);
}

.shop-silo-info-wrapper .shop-shipping-content .shop-output-value-content {
    /*max-width: 40%;*/
    word-break: break-word;
    overflow-wrap: break-word;
    text-wrap: auto;

}

.shop-start-main .shop-output-value .shop-output-title,
.shop-start-main .shop-output-value {
    font-size: var(--Paragraph-medium-font-size);
}

/* Shop Start - Carousel */

.shop-start-main-carousel-wrapper {
    margin-bottom: 35px;
}

.shop-start-main-carousel-wrapper-header {
    display: flex;
    padding: 20px;
    padding-left: 0px;
}

.shop-start-main-carousel-wrapper-header p {
    font-size: var(--h2-font-size);
}

.shop-start-main-carousel-wrapper-sub-header {
    color: var(--text-color);
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
    padding-left: 0px;
}

.shop-start-main-carousel {
    position: relative;
    width: 100%;
}

.shop-start-main-carousel__stage {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    white-space: nowrap;
}

.shop-start-main-carousel__panels {
    /* display: inline-block; */
    display: flex;
    align-items: start;
    vertical-align: top;
    white-space: nowrap;
    justify-content: center;
    /* padding-left: 20px;
    padding-right: 20px; */
    gap: 30px;
}


.shop-start-main-carousel__panel {
    display: inline-block;
    position: relative;
    padding: 10px;
    max-width: 286px;
    height: 300px;
    /* margin-right: 20px; */
    vertical-align: top;
    background-color: var(--background-color);
    width: 100%;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
}

.shop-start-main-carousel-order .shop-start-main-carousel__panel,
.shop-start-main-carousel-quote .shop-start-main-carousel__panel {
    height: 300px;
}

.shop-start-main-carousel__panel-button {
    position: absolute;
    bottom: 10px;
    width: 94%;
    border: 1px solid white;
}

.shop-start-main-carousel__panel .shop-output-value {
    /*gap: 40px;*/
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    padding-left: 10px;
}

.shop-start-main-carousel__panel .shop-output-title {
    display: inline-block;
    width: 110px;
    font-family: var(--font-family-Normal) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-500);
    flex-shrink: 0;
}

.shop-start-main-carousel__panel .shop-output-value-truncate {
    text-overflow: ellipsis;
    overflow: hidden;
}

.shop-start-main-carousel__panel-content-wrapper {
    /*display: flex;*/
    flex-direction: column;
    justify-content: space-evenly;
    height: 287px;
}

.my-carousel-wrapper {
    padding-top: 20px;
}

.my-carousel-navigation-button {
    position: absolute;
    z-index: 1;
    width: fit-content;
}

.my-carousel-button-prev {
    left: -60px;
}

.my-carousel-button-next {
    right: -60px;
}

.my-carousel-slide {
    display: inline-block;
    position: relative;
    padding: 10px;
    max-width: 300px;
    height: 300px;
    /* margin-right: 20px; */
    vertical-align: top;
    background-color: var(--background-color);
    width: 100%;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
}

.my-carousel-slide-headline {
    min-height: 55px;
    white-space: break-spaces;
}

.my-carousel-slide-silo {
    height: 360px;
}

@media (max-width: 1201px) {
    .my-carousel-wrapper {
        padding-bottom: 50px;
    }

    .my-home-main .md-Table table th {
        min-width: 25px;
    }

    .shop-search-content-wrapper {
        padding: 0 20px;
    }

    .shop-grid-search-main {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .shop-product-detail-button_icon-border-filled {
        border-radius: 50% !important;
        background-color: var(--brand-color) !important;
        color: white !important;
        border: 1px solid var(--brand-color) !important;
    }

    .my-carousel-navigation-button:hover .shop-product-detail-button_icon-border-filled {
        background-color: white !important;
    }

    .slds-icon-text-default {
        --slds-c-icon-color-foreground: white !important;
        /*--slds-c-icon-color-foreground: #000 !important;*/
    }

    .my-carousel-navigation-button:hover .slds-icon-text-default {
        --slds-c-icon-color-foreground: var(--brand-color) !important;
    }

    .my-carousel-button-prev {
        left: calc(50% - 50px);
        bottom: -20px;
    }

    .my-carousel-button-next {
        right: 0px;
        left: calc(50% + 10px);
        bottom: -20px;
    }

    .shop-start-main-carousel__panels {
        gap: 20px;
    }
}

@media (max-width: 552px) {
    .my-carousel-slide {
        max-width: 100%;
    }

    .shop-start-main-carousel__panels {
        justify-content: center;
    }

    .shop-start-main-carousel__panel {
        max-width: 100%;
    }
}

.shop-start-main-button {
    width: 40px;
    /* Fixed width for spacing */
    height: 40px;
    /* Fixed height */
    /* Additional styling as needed */
}

.shop-start-main-carousel-button-wrapper {
    margin-left: 10px;
    margin-right: 10px;
}

.shop-start-main-button_icon-x-small {
    padding: 0;
}

.shop-start-main-button_icon-border-filled {
    border: 1px solid #ffffff;
    border-radius: 3px;
    background-color: #ffffff;
    --slds-c-icon-color-foreground-default: var(--brand-color);
}

.shop-start-main-button_icon-border-filled:hover {
    background-color: #d8dde6;
    --slds-c-icon-color-foreground-default: var(--brand-color);
}

.shop-start-main-text-color_default {
    color: #1b1f23;
}


.shop-start-main-carousel-when-no-buttons {
    /* padding-left: 20px; */
    /* padding-right: 20px; */
}

.shop-start-main-carousel-center-items {
    justify-content: flex-start;
}

.shop-start-main-carousel-item-with-border {
    border: 2px solid var(--brand-color);

}




/* ***** Component Specific ***** */
/* Header */
.shop-header-actions-left {
    justify-self: flex-start;
    height: 30px;
    margin-left: -2px;
}

.shop-icon-burger.icon {

    position: relative;
    display: inline-block;
    height: 30px;
    width: 30px;
    border: 0;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-color: var(--brand-color);
    background-image: var(--shop-icon-burger-icon);
    cursor: pointer;
}

.shop-header-actions-right {
    display: flex;
    align-items: center;
    height: 50px;

}


.shop-cart-item-count {
    /* Positioning */
    position: absolute;
    top: 2px;
    color: var(--background-color);
    font-size: var(--navigation-small-font-size);
    /*right: 63px;*/

}


.shop-mobile-title {
    margin-top: 30px;
    margin-bottom: 0px !important;
}

.shop-sub-header {
    display: none;
}

.shop-sub-header-content {
    display: flex;
    width: 1340px;
    padding: 0 50px;
    margin: 0 auto;
}

.shop-sub-header-content a:hover {
    color: var(--brand-color) !important;
    text-decoration: none !important;
}

.shop-cart {
    /* Positioning */
    /*position: fixed;*/

    /*right: 73px;*/
    /* Display & Box Model */
    width: 32px;
    height: 25px;
    margin-right: 15px;
}

.shop-cart-button {
    /* Display & Box Model */
    border: 0;
    width: 25px;
    height: 25px;
    /* Color */
    /*background-color: red;*/
    background-color: var(--brand-color);
    background-image: var(--shop-cart-button-icon);
    background-position: top;
    background-repeat: no-repeat;
    background-size: contain;
}

.shop-user-photo {
    /* Positioning */
    /*position: fixed;
    right: 5.9vw;
    width: 32px;*/

    /* Display & Box Model */
    height: 30px;
    border: 0px;
    margin-right: 0px;
    /* Color */
}

.shop-user-photo img {
    /* Positioning */
    /*position: fixed;
    right: 5.9vw;
    width: 32px;*/

    /* Display & Box Model */
    width: 30px;
    height: 30px;
    border-radius: 50%;
    /* Color */
}


/* Shop Search Main */
.shop-search-main .shop-search-header {
    min-height: 205px;
    width: 100%;
    text-align: center;
    background-color: var(--background-color);
    padding: 20px;
    margin-top: 96px;
}

.shop-search-headline {
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-500);
    letter-spacing: .05rem;
}

.shop-search-main .shop-search-header-text {
    padding-top: 10px;
    color: var(--text-color);
    font-family: var(--font-family-Normal) !important;
    font-size: var(--Paragraph-big-font-size) !important;
    font-weight: var(--font-weight-500);

}

.shop-search-main .shop-search-sub-header-text {
    color: var(--text-color);
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
}

/* 6.2.1 Shop Search Breadcrumbs */
.shop-search-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.shop-search-breadcrumb__item a {
    color: var(--brand-color);
    text-decoration: none;
}

.shop-search-breadcrumb__item {
    font-size: 0.8125rem;
    cursor: pointer;
}

.shop-search-breadcrumb-icon {
    position: relative;
    display: inline-block;
    width: 25px;
    height: 25px;
    cursor: pointer;
    border: 0;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: var(--shop-search-breadcrumb-icon);
}


/* Shop Search Bar */
.shop-search-bar .icon {
    top: 7px;
    position: relative;
    left: -70px;
    display: inline-block;
    min-width: 25px;
    min-height: 25px;
    cursor: pointer;
    border: 0;
    background-repeat: no-repeat;
    background-size: 65% 65%;
    background-image: var(--shop-search-bar-icon);
}

.shop-search-bar .custom-input {
    width: calc(100% - 70px);
    max-width: 800px;
    margin-top: 20px;
    margin-bottom: 15px;
    margin-right: 25px;
    margin-left: 25px;
}

.shop-search-bar .custom-input:focus {
    box-shadow: none;
}

/* Shop Search Result */
.shop-search-grid-item {
    border: 2px solid var(--background-color-white);
}

.shop-search-main .shop-product-detail-carousel-item-without-border {
    border: 2px solid var(--background-color-white);
    padding-left: 0px;
    padding-right: 0px;
}

.shop-search-main .shop-grid-col-4 {
    padding: 20px;
}

.shop-search-load-more {
    height: 31px;
    margin: 0 auto;
    border-bottom: 1px dashed var(--brand-color);
    text-align: center;
}

.shop-search-load-more-button {
    display: flex;
    justify-content: center;
    margin-top: 50px;
}

.shop-search-load-more-button a {
    font-size: var(--Button-font-size);
}

/* Shop Search Result Column / Shop Items */
.shop-cart-main .shop-product-item-img-top,
.shop-checkout-main .shop-product-item-img-right,
.shop-overlay-content .shop-product-item-img-right {
    display: none;
}

.shop-detail-main .shop-grid-col-carousel {
    width: 100%;
}

.shop-detail-main-Info {
    max-width: 1340px;
    margin: 0 auto 0 auto;
    padding: 0 50px;
    letter-spacing: 0.05rem;
}

.shop-product-item-img-top {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 216px;
    text-align: center;
}

.shop-detail-product-icon-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

.shop-detail-product-icon-circle {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: var(--brand-color);
    overflow: hidden;
}

.shop-detail-product-icon {
    width: 50px;
    height: auto;
}

.shop-product-item-img-top>img {
    max-height: 200px;
    max-width: 200px;
}

.shop-product-item-img-right {
    float: right;
    width: 150px;
    /* margin-right: 20px; */

}

.shop-silo-cart .shop-item-actions {
    right: 10px;
    position: absolute;
    padding: 0px 10px 5px 0px;
}

.shop-silo-img-right {
    float: right;
    width: 100px;
}

.shop-silo-img-right img {
    width: 150px;
    height: 150px;
    object-fit: contain;
    object-position: top;

}

.shop-product-item-img-right img {
    width: 150px;
    height: 150px;
    object-fit: contain;
    object-position: top;

}

.shop-product-item-img-left {
    float: left;
    width: 100px;
    margin-right: 20px;
}

.shop-checkout-main .shop-cart-prodname,
.shop-item-prodname {
    overflow: hidden;
    padding-top: 20px;
    padding-bottom: 15px;
}

.shop-overlay-prodname,
.shop-cart-prodname {
    padding-top: 10px;
    padding-bottom: 10px;
    /* margin-left: 20px; */
}

.shop-cart-prodname>p,
.shop-overlay-prodname>p,
.shop-item-prodname>p {
    font-family: var(--font-family-Light) !important;
    font-size: var(--h4-font-size);
    font-weight: var(--font-weight-300);
    line-height: 1.15;
    cursor: pointer;
    min-height: 92px;
}

.shop-item-prodname>p .shop-item-prodname>p:hover {
    color: var(--brand-color);
}

.shop-detail-product-wrapper:hover .shop-item-prodname>p {
    color: var(--brand-color);
}

.shop-detail-product-wrapper:hover {
    cursor: pointer;
}

.shop-item-quantity-converter {
    float: right;
    display: none;
}

.shop-item-attribute {
    height: 220px;
}

.shop-item-actions {
    float: right;
}



.shop-item-row-edit-Quantity .icon {
    position: relative;
    left: -70px;
    display: inline-block;
    border: 0;
    height: 25px;
    width: 25px;
    background-repeat: no-repeat;
    background-size: 65% 65%;
    background-image: var(--shop-item-row-edit-quantity-icon);
    cursor: pointer;
}

.shop-item-actions .icon {
    position: relative;
    display: inline-block;
    height: 30px;
    width: 30px;
    border: 0;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-color: #fff;
    cursor: pointer;
}

.shop-item-actions button {
    border: 0;
}

.shop-item-actions .shop-icon-write.icon {
    background-image: var(--shop-icon-write-icon);
}

.shop-item-actions .shop-icon-trash.icon {
    background-image: var(--shop-icon-trash-icon);
}

/* Shop Checkout */
.shop-checkout-main .shop-cart-item {
    padding: 0;
}

.shop-checkout-main .shop-checkout-main-grid-item.shop-billing-item {
    flex-grow: 1;
}

.shop-checkout-main .shop-cart-item h4,
.shop-checkout-main .shop-delivery .shop-delivery-title h4,
.shop-checkout-main .shop-shipping .shop-shipping-title h4,
.shop-checkout-main .shop-billing .shop-billing-title h4 {
    padding: 20px 0px;
    font-family: var(--font-family-Light) !important;
    font-size: var(--h3-font-size) !important;
    overflow-wrap: break-word;
}



.shop-checkout-main .shop-delivery,
.shop-checkout-main .shop-shipping,
.shop-checkout-main .shop-billing {
    height: 100%;
}

.shop-checkout-main .shop-delivery .shop-delivery-content,
.shop-checkout-main .shop-shipping .shop-shipping-content,
.shop-checkout-main .shop-billing .shop-billing-content {
    padding: 20px;
    border: var(--border-brand);
    height: calc(100% - 78px);
    /*box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);*/
}


.shop-checkout-main .shop-billing-customer-number,
.shop-checkout-main .shop-shipping-customer-number {
    display: block;
    margin-top: 15px;
}

.shop-checkout-main .shop-checkout-actions .shop-button-action-inverse,
.shop-checkout-main .shop-checkout-actions .shop-button-action {
    width: 100%;
    max-width: 400px;
}

.shop-checkout-main .slds-radio .slds-form-element__label {
    font-size: 18px;
    letter-spacing: 0.05rem;
}

.shop-checkout-main textarea.slds-textarea {
    font-size: var(--Paragraph-medium-font-size);
    letter-spacing: 0.05rem;
}

.shop-checkout-main input {
    font-size: var(--Paragraph-medium-font-size);
}

.shop-button-action-adm:hover {
    background-color: white;
    border-color: var(--CTA-button-color);
    color: var(--CTA-button-color);
}

.shop-checkout-main .shop-checkout-actions {
    display: flex;
    align-items: center;
    justify-content: center;

}

.shop-checkout-main .shop-item-actions {
    float: right;
    position: absolute;
    bottom: 0px;
    right: 0px;
    padding: 0px 10px 5px 0px;
}

.shop-checkout-main .shop-grid {
    gap: 20px;
}

.shop-checkout-main .shop-grid-col-4 {
    position: relative;
    padding: 20px 20px 40px 20px;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
}

.shop-silo-info-container .shop-shipping-content-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0px;
    justify-content: center;
}

.shop-shipping-content-wrapper {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.shop-cart-order-items .shop-shipping-title {
    padding-top: 40px;
    padding-left: 40px;

}

.shop-shipping-content-cart-wrapper {
    padding-left: 40px;
}

.shop-shipping-content-cart-wrapper .shop-output-value {
    gap: 40px;
    white-space: normal;
}

.shop-cart-main .shop-shipping-title>h4 {
    padding: 0px 0 20px 0 !important;
}

.shop-cart-main .shop-output-value .shop-output-title,
.shop-cart-main .shop-output-value {
    font-size: var(--Paragraph-medium-font-size);
}

.shop-checkout-main .shop-checkout-CTA-buttons {
    margin-bottom: 200px;
}

.shop-checkout-main-header {
    /*padding-left: 20px;
    padding-right: 20px;*/
}

.shop-checkout-main-grid-container {
    justify-content: space-between;
    gap: 20px;
    padding: 20px 0px;
}

.shop-silo-info-container {
    width: 100%;
    padding-right: 0px;
}

.shop-silo-info-detail-container {
    width: 100%;
    padding-right: 0px;
}

.self-service-main .shop-grid-col-3,
.shop-checkout-main .shop-grid-col-3 {
    /*padding: 10px;
    border: 1px solid var(--brand-color);*/
}

.shop-checkout-main-grid-item {
    position: relative;
    min-height: 0px;
}

.shop-confirmation-wrapper .shop-checkout-main {
    margin-top: 0px;
}

.shop-confirmation-wrapper .shop-checkout-main .shop-checkout-refresh-price {
    display: none;
}

.shop-confirmation-wrapper .shop-checkout-main-grid-item {
    min-height: 0;
}

.shop-checkout-main .shop-checkout-edit-pen {
    position: absolute;
    bottom: 0px;
    right: 0px;
}

.shop-checkout-subtotal-information {
    /*padding-left: 20px;
    padding-right: 20px;*/
    width: 100%;
}

.shop-checkout-main .shop-item-attributes {
    height: 180px;
}

.shop-checkout-main .shop-consent-texts {
    margin-left: 35px;
}

.shop-checkout-main .shop-checkout-info-texts small,
.shop-checkout-main .shop-consent-texts small {
    font-size: var(--Paragraph-medium-font-size);
}


.shop-checkout-main .shop-consent-texts small a {
    color: var(--brand-color);
}


.shop-checkout-main .shop-total .shop-output-title {
    width: 180px;

}

.shop-checkout-delivery-option-errorMessage {
    color: var(--warning-color);
}

.shop-checkout-main .shop-checkout-delivery-option-radio {
    --slds-c-radio-mark-color-foreground: var(--brand-color);
}

.shop-checkout-main .shop-grid-col.shop-checkout-products {
    padding-bottom: 20px;
}

.shop-checkout-main .shop-output-value .shop-output-title,
.shop-checkout-main .shop-output-value {
    font-size: var(--Paragraph-medium-font-size);
}




/* Shop Overlay */
.shop-overlay-content a {
    color: var(--brand-color);
}

.shop-overlay-content {
    /* Positioning */
    position: fixed;
    z-index: 10;
    top: 0;
    right: 0px;
    /* Display & Box Model */
    overflow: auto;
    width: 100%;
    height: 100vh;
    justify-content: center;
    align-items: center;
    /* Color */
    background-color: #fff;
    /* Other */
    transition: right 0.5s ease;
    /* Smooth transition */
}

.shop-overlay-content .shop-output-title,
.shop-overlay-content .shop-output-value {
    font-size: var(--Paragraph-medium-font-size);
}

.shop-overlay-content {
    letter-spacing: 0.05rem;
    color: var(--text-color);
    font-size: var(--Paragraph-big-font-size);
}

.shop-overlay-content h4 b {
    font-weight: var(--font-weight-500);
}

.shop-overlay-close {
    /* Positioning */
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 20;

    /* Other */
    cursor: pointer;
}

.shop-overlay-visible {
    right: 0px;
    /* Slide in */
}

.shop-overlay-title {}


.shop-overlay-info-text {
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
    color: var(--text-color);
}

.shop-overlay-content .shop-cart-item-edit-label {
    width: 110px;
    font-size: var(--Paragraph-medium-font-size);
}



/* 6.8. Shop Cart */
.shop-cart-main {
    letter-spacing: 0.05rem;
}

.shop-cart-main h4 b {
    font-weight: var(--font-weight-500);
}

.shop-cart-main .shop-cart-item {
    display: none;
}

.shop-cart-main .shop-p-around-x-large {
    padding: 40px 40px;
}

.shop-cart-info-screen.shop-cart-info-screen-visible {
    padding: 0px;
    color: var(--text-color);
    background: #fff;
}

.shop-cart-order.shop-cart-info-screen-visible {
    border-bottom: none;
}

.shop-cart-info-screen .shop-cart-info-overlay {
    visibility: hidden;
}

.shop-cart-info-screen.shop-cart-info-screen-visible .shop-cart-info-overlay {
    position: fixed;
    left: 0px;
    right: 0px;
    background: #ccc;
    top: 0px;
    bottom: 0px;
    z-index: 5;
    visibility: visible;
}

.shop-cart-close {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 20;
    cursor: pointer;
}

.shop-cart-info-screen-visible.shop-cart-order {
    right: 0px;
    border-bottom: var(--border-dark);
    border-width: 2px;
}

.shop-cart-order {
    position: fixed;
    top: 0px;
    right: -500px;
    height: 220px;
    width: 100%;
    padding: 40px;
    border-bottom: var(--border-dark);
    background: #fff;
    transition: right 0.5s ease;
    z-index: 10
}

.shop-cart-order-items {
    margin-top: 210px;
    padding: 0px;
}

.shop-cart-order-title {}

.shop-cart-order-button-section {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.shop-cart-order-total {
    text-align: right;
    font-family: var(--font-family-Normal) !important;
    font-size: var(--Paragraph-medium-font-size);
    font-weight: var(--font-weight-500);
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.shop-cart-info-screen {
    /* Positioning */
    position: fixed;
    z-index: 6;
    top: 0;
    right: -500px;
    overflow: auto;
    /* Display & Box Model */
    width: 100%;
    height: 100vh;
    padding: 20px;
    justify-content: center;
    align-items: center;
    /* Color */
    background-color: #fff;
    color: var(--background-color);
    /* Other */
    transition: right 0.5s ease;
    /* Smooth transition */
}

.shop-cart-info-screen-visible {
    right: 0px;
    /* Slide in */
}

.shop-cart-main .shop-shipping-customer-number {
    display: none;
}

.shop-cart-refresh-button {
    background: white;
    border: none;
    height: 33px;
    width: 33px;

}

.shop-cart-main .shop-cart-refresh-button {
    margin-right: 20px;
}

.shop-cart-refresh-price-button-icon {
    position: relative;
    display: inline-block;
    height: 33px;
    width: 33px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: var(--shop-cart-refresh-price-button-icon);
    padding-left: 0px;
}

.shop-cart-item-edit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.shop-cart-item-edit-label {
    font-family: var(--font-family-Normal) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-500);
    color: var(--text-color);
    /* margin-left: 20px; */
}

.shop-cart-item-edit-input {
    width: 280px;
    border-color: var(--brand-color);
}

.shop-cart-item-textarea-input {
    width: 280px;
    --slds-c-textarea-color-border: var(--brand-color);
}

.shop-cart-item-textarea-input-kmat {
    width: 280px;
    --slds-c-textarea-color-border: var(--brand-color);
}

.shop-cart-item-textarea-input-checkout {
    --slds-c-textarea-color-border: var(--brand-color);
}

.shop-cart-item-kmat-farbtonkarte-input {
    padding: 10px 10px;
    border-color: var(--brand-color);
    border-radius: var(--border-radius-default);
    --slds-c-input-color-border: var(--brand-color);
    height: 46px;
}

.shop-cart-item-kmat-farbnummer-input input {
    height: 46px;
    padding: 0 1rem 0 0.75rem;
    border: var(--border-brand);
}

.farbenBox ol {
    border: var(--border-brand);
    border-radius: 3px;
    margin-top: -5px;
}

.farbenBox ol li {

    cursor: pointer;
}

.farbenBox ol li:hover {
    background-color: var(--brand-color-light);
}

.farbenBox ol li:first-child {
    padding-top: 8px;
}


/* ***** 6.9. Shop Search Filter ***** */
.shop-search-filter-button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 15px;
    margin-top: 5px;
}

.shop-search-filter-toggle-button,
.shop-search-filter-add-button {
    flex: 1;
    border-radius: 5px;
    font-family: var(--font-family-Normal);
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    min-width: 350px;
    max-width: 395px;
    min-height: 55px;
    font-size: var(--Button-font-size);
}

.shop-search-filter-toggle-button {
    border: 1px solid var(--brand-color) !important;
    background: var(--background-color);
    color: var(--brand-color);
}

.shop-search-filter-toggle-button-activ {
    border: 1px solid var(--brand-color) !important;
    background: var(--brand-color) !important;
    color: white !important;
}

.shop-search-filter-toggle-button-icon {
    display: inline-block;
    height: 33px;
    width: 32px;
    margin-right: 8px;
    /* Margin to separate icon and text */
    border: 0;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: var(--shop-search-filter-toggle-button-icon);
    transition: 0.3s;
}

.shop-search-filter-toggle-button-icon-activ {
    background-image: var(--shop-search-filter-toggle-button-icon-activ);
}

.shop-search-filter-add {
    display: none;
}

.shop-search-filter-add-show {
    display: contents !important;
}

.shop-search-filter-back-button {
    font-size: 0.9em;
    margin-top: 5px;
    margin-bottom: 15px;
    font-family: var(--font-family-Normal);
    border-radius: 5px;
    width: 100%;
    height: 48px;
}

.shop-search-filter-info-screen-visible.shop-search-filter-order {
    left: 0px;
}

.shop-search-filter-order .multi-select-combobox__input {
    font-size: var(--Paragraph-big-font-size);
    letter-spacing: .05rem;
}

.shop-search-filter-order {
    top: 0px;
    left: -5000px;
    height: 100%;
    width: 100%;
    border-bottom: var(--border-dark);
    padding-top: 10px;
    padding-left: 25px;
    padding-right: 25px;
    padding-bottom: 10px;
    position: fixed;
    color: var(--text-color);
    background: var(--background-color);
    transition: left 0.5s ease;
    z-index: 10;
    overflow-y: scroll;
}

.shop-search-filter-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 100px;
}

.shop-search-filter-reset a {
    font-size: var(--Paragraph-medium-font-size);
}

.shop-search-filter-reset a:active,
.shop-search-filter-reset a:focus,
.shop-search-filter-reset a:hover {
    color: var(--brand-color);
}

.shop-search-filter-info-screen {
    /* Positioning */
    position: fixed;
    z-index: 6;
    top: 0;
    left: -5000px;
    overflow: auto;
    /* Display & Box Model */
    width: 100%;
    height: 100vh;
    padding: 20px;
    justify-content: center;
    align-items: center;
    /* Color */
    background-color: #fff;
    color: var(--background-color);
    transition: right 0.5s ease;
}

.shop-search-filter-info-visible {
    left: 0px;
}

.shop-accordion-section .shop-section-header {
    color: var(--text-color);
    font-family: var(--font-family-Light) !important;
    font-size: var(--h3-font-size);
    font-weight: var(--font-weight-300);
    margin-top: 25px;
    margin-bottom: 15px;
    cursor: pointer;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

.shop-accordion-section .shop-section-header-icon {
    --slds-c-icon-color-foreground-default: var(--brand-color);
}

.shop-accordion-section .shop-accordion-section-border {
    border-bottom: var(--border-dark);
    margin-top: 25px;
}

.shop-section-content {
    padding: 0px;
    display: none;
    color: var(--text-color);
}

.shop-section-content.show {
    display: block;
}

.shop-section-content.show u {
    color: var(--text-color);
    margin-left: 15px;
    margin-top: 20px;
    padding-top: 5px;
    font-size: var(--Paragraph-big-font-size);
}

.shop-search-filter-category-2-list a {
    color: var(--text-color);
    margin-left: 5px;
    margin-top: 20px;
    padding-top: 5px;
    font-size: var(--Paragraph-big-font-size);
}

.shop-search-filter-category-2-list a:hover {
    color: var(--brand-color);
    text-decoration: none;
}

.shop-search-filter-combobox-item-wrapper {
    font-size: var(--Paragraph-medium-font-size);
}

.shop-search-filter-list-quotes {
    /* Display & Box Model */
    /* height: 300px; */
    overflow-y: scroll;
    width: 100%;
    padding-top: 20px;
    justify-content: center;
    align-items: center;
    /* Color */
    color: black;
}

.slds-datepicker__month th {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    line-height: 1.5rem;
    color: var(--brand-color) !important;

}

.slds-datepicker__month {
    margin-top: 10px !important;
}

.shop-search-filter-list-quotes .shop-output-value {
    gap: 40px !important;
}

.shop-search-filter-list-quote:hover .shop-output-value {
    color: white;
}

.shop-search-filter-list-quote:hover .shop-output-title {
    color: white;
}

.shop-search-filter-list-quote-selected .shop-output-title {
    color: white;
}

.shop-search-filter-close {
    padding-bottom: 14px;
}

button.shop-search-filter-toggle-button:hover {
    background: var(--brand-color);
    color: white;
}

button.shop-search-filter-toggle-button:hover .shop-search-filter-toggle-button-icon {
    background-image: var(--shop-search-filter-toggle-button-icon-activ);
}

.shop-shipping-content-wrapper .shop-output-value {
    display: flex;
    overflow: hidden;
    flex-wrap: wrap;
    gap: 0px;
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
}

.shop-shipping-content-wrapper .shop-output-title {
    width: 140px;
}

.shop-search-filter-list-quote {
    /* Color */
    background-color: white;
    color: var(--text-color);
    margin-top: 5px;
    padding: 20px;
}

.shop-search-filter-list-quote-selected {
    /* Color */
    background-color: var(--brand-color);
    color: var(--background-color);
    margin-top: 5px;
    padding: 20px;
}

.shop-search-filter-list-quote-selected .shop-output-value {
    color: white;
}

.shop-search-filter-list-quote:hover {
    /* Color */
    background-color: var(--brand-color);
    color: white;
    /* Other */
    cursor: pointer;
}

.shop-search-filter-list-orders {
    /* Display & Box Model */
    /* height: 300px; */
    overflow-y: scroll;
    width: 100%;
    padding-top: 20px;
    justify-content: center;
    align-items: center;
    /* Color */
    color: black;
}

.shop-search-filter-list-order {
    /* Color */
    background-color: white;
    color: var(--text-color);
    margin-top: 5px;
    padding: 20px;
}

.shop-search-filter-list-order-selected {
    /* Color */
    background-color: var(--brand-color);
    color: var(--background-color);
    margin-top: 5px;
    padding: 20px;
}

.shop-search-filter-list-order-selected .shop-output-value,
.shop-search-filter-list-order-selected .shop-output-value .shop-output-title {
    color: white;
}

.shop-search-filter-list-order:hover {
    /* Color */
    background-color: var(--brand-color);
    color: white;
    /* Other */
    cursor: pointer;
}

.shop-search-filter-list-order:hover .shop-output-value {
    color: white;
}

.shop-search-filter-list-order:hover .shop-output-title {
    color: white;
}

.shop-custom-input-date-picker-icon {
    top: 2.7rem;
    /* margin-right: 2.3vw !important;*/
    margin-left: 0.2vw;
    cursor: pointer;
    border: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    background-repeat: no-repeat;
    background-color: white;
    background-size: 90% 90%;
    background-image: var(--shop-custom-input-date-picker-icon);
}

.shop-custom-input-date-picker {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    background-color: #ffffff;
    border: 1px solid var(--brand-color);
    border-radius: 0.25rem;
    transition: border 0.1s linear, background-color 0.1s linear;
    line-height: 0;
}

.shop-custom-input-date-picker .slds-select {
    border: var(--border-brand);
    padding: 5px 20px;
    height: 30px;
    color: var(--text-color);
    display: block;
    font-size: var(--Paragraph-small-font-size);
    line-height: 1;
}

.shop-search-filter-date-picker-wrapper {
    display: flex;
    gap: 5px;
    /* flex-wrap: wrap; */
    justify-content: space-between;
    width: 100%;
    padding: 0px;
}

.shop-custom-input-date-picker-input-wrapper {
    position: relative;
}

.shop-search-filter-date-picker-input {
    --lwc-shadowButtonFocus: 0;
    --lwc-borderWidthThin: 0;
    --slds-c-input-shadow-focus: 0;
    --sds-c-input-shadow-focus: 0;
    padding-top: 5px;
    padding-bottom: 5px;
    width: 100%;
}

.slds-listbox__option .slds-truncate {
    letter-spacing: .05rem;
    color: var(--text-color);
}

/* update color & background for today date */
.slds-datepicker tbody>tr>td.slds-is-today>.slds-day {
    background: var(--brand-color-light);
    color: var(--text-color);
}

/* update color & background for selected date */
.slds-datepicker tbody>tr>td.slds-is-selected>.slds-day {
    background: var(--brand-color);
    color: var(--text-color);
    font-weight: 700;
}

/* update color & background for hover date */
.slds-datepicker tbody>tr>td:hover span {
    background: var(--brand-color);
    color: var(--text-color);
}

.shop-search-filter-category-2-list {
    margin-top: 25px;
}



/* 6.91. Shop Confirmation Page */

.shop-confirmation-wrapper .shop-checkout-consent {
    display: none;
}

.shop-confirmation-wrapper .shop-checkout-CTA-buttons {
    display: none;
}

.shop-confirmation-wrapper .shop-item-actions {
    display: none;
}

.shop-confirmation-icon {}

.shop-confirmation-icon-text {}

.shop-box-cta {
    background: var(--CTA-background-light-color);
    border: var(--CTA-border-color);
}

.shop-text-end {
    padding-bottom: 150px;
}

.shop-confirmation-content .shop-confirmation-actions .shop-button-action-inverse,
.shop-confirmation-content .shop-confirmation-actions .shop-button-action,
.shop-confirmation-main .shop-confirmation-actions .shop-button-action-inverse,
.shop-confirmation-main .shop-confirmation-actions .shop-button-action {
    width: 100%;
    max-width: 300px;
}

.shop-confirmation-content .shop-confirmation-actions,
.shop-confirmation-main .shop-confirmation-actions {
    display: flex;
    align-items: center;
    justify-content: center;
}

.shop-confirmation-main .shop-icon-check {
    display: flex;
    align-items: center;
    justify-content: center;
    /* background-repeat: no-repeat; */
    /* background-size: 85% 85%; */
    height: 200px;
    width: 200px;
    background-size: 100% 100%;
    background-image: var(--shop-confirmation-icon-check);
}

.shop-checkout-main .shop-cart-prodname>p {
    font-family: var(--font-family-Light) !important;
    font-size: var(--h4-font-size);
    font-weight: var(--font-weight-300);
    line-height: 1.15;
    cursor: text;
}

/* 6.92. Shop Detail */
.shop-product-detail-header-wrapper {
    display: flex;
    align-items: flex-start;
    flex-wrap: nowrap;
    min-height: 270px;
    margin-bottom: 20px;
    /*padding-left: 20px;*/
}

.shop-product-detail-title {
    margin-top: 0;
    color: var(--text-color);
    font-size: var(--h1-font-size);
    font-weight: 100;
    line-height: 1.1;
    padding-bottom: 20px;
}

.shop-product-detail-subtitle {
    color: var(--text-color);
    font-weight: 100;
    font-size: var(--h3-font-size);
    display: block;
}

.shop-product-detail-image-container {
    display: none;
    height: 270px;
    width: 270px;
    position: relative;
}

.shop-product-detail-image-container-mobile {
    min-width: max-content;
    margin-right: 20px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shop-product-detail-image-container-mobile img {
    margin-bottom: 10px;
}

.shop-product-detail-image-container img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.shop-product-detail-text {
    padding-left: 0px;
    flex-grow: 1;
}

.shop-product-detail-checklist-advantages {
    list-style: none;
    padding-top: 20px;
}

.shop-product-detail-checklist-advantages li {
    /* margin-bottom: -25px; */
    display: flex;
    font-size: var(--Paragraph-medium-font-size);
    align-items: center;
    line-height: 1.1;
    padding: 5px 0px;
    color: var(--text-color);
}

.shop-product-detail-checklist-advantages-icon {
    transform-origin: center;
    --sds-c-icon-color-background: #666 !important;
}

.shop-product-detail-description,
.shop-product-detail-systemConnections,
.shop-product-detail-materialBase {
    color: var(--text-color);
    font-size: var(--Paragraph-big-font-size);
}

.shop-product-detail-materialBase p {
    margin-bottom: 5px;
}

.shop-product-detail-checklist-materialBase {
    list-style-type: disc;
    margin-left: 20px;
}

.shop-detail-consumption-calculator-placeholder {
    margin-top: 60px;
    margin-bottom: 60px;
}

.shop-detail-consumption-calculator {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 60px;
    margin-bottom: 60px;
    padding: 0 20px;
    min-height: 170px;
    width: 100%;
    background-color: var(--background-color);
}

.shop-detail-consumption-calculator-button {
    width: calc(100% - 70px);
    max-width: 700px;
    margin-top: 20px;
    margin-bottom: 15px;
    margin-right: 25px;
    margin-left: 25px;
}

.shop-product-detail-checklist-materialBase {
    list-style-type: disc;
}

.shop-product-detail-icon-wrapper img {
    margin-right: 20px;
}

.shop-product-detail-information {
    width: 100%;
    margin-top: 20px;
}

.shop-product-detail-information-wrapper {
    display: flex;
    /*padding-left: 20px;
    padding-right: 20px;*/
    flex-wrap: wrap;
}

.shop-product-detail-information-description-wrapper {
    padding-left: 0px;
    padding-right: 0px;
}

.shop-product-detail-information-header p {
    font-size: var(--h3-font-size);
    color: var(--text-color);
    padding-bottom: 30px;
}

.shop-product-detail-technical-documentation-list-item {
    padding: 10px;
}

.shop-product-detail-technical-documentation-list-item a {
    color: var(--brand-color);
    text-decoration: underline;
    text-decoration-color: inherit;
}

.shop-product-detail-technical-documentation-list-item a:hover {
    text-decoration: none !important;
}

.shop-product-detail-technical-documentation-list-item:nth-child(even) {
    background-color: var(--background-color);
}

.shop-product-detail-technical-documentation-wrapper {
    padding-left: 0px;
}

/* 6.92.1 Shop Detail Carousel */
.shop-product-detail-carousel-wrapper {
    margin-bottom: 20px;
    /* overflow: hidden; */
    /* margin-top: 1rem; */
}

.shop-product-detail-carousel-wrapper .my-carousel-button-prev {
    left: 0px;
}

.shop-product-detail-carousel-wrapper .my-carousel-button-next {
    right: 0px;
}

.shop-product-detail-carousel-wrapper .my-carousel-navigation-button {
    position: relative;
    margin: auto 0px;
    width: 40px;
}

.shop-product-detail-carousel {
    position: relative;
    width: 100%;
    /* overflow: hidden; */
    /* margin-top: 1rem; */
}

.shop-product-detail-carousel__stage {
    width: 100%;
    margin: 0 auto;
    /*overflow: hidden;*/
    white-space: nowrap;
}

.back-to-page {
    padding-bottom: 40px;
}

.back-to-page a {
    font-size: var(--Paragraph-big-font-size);
}

.shop-product-detail-carousel__panels {
    /* display: inline-block; */
    display: flex;
    align-items: flex-start;
    vertical-align: top;
    white-space: normal;
    justify-content: center;
    gap: 28px;
}

.shop-product-detail-carousel__panel {
    display: inline-block;
    position: relative;
    max-width: 290px;
    vertical-align: top;
    background-color: var(--background-color);
    width: 100%;
}

.shop-product-detail-carousel-wrapper .shop-product-detail-carousel__panel {
    max-width: 294px;
}

@media (max-width: 552px) {
    .shop-product-detail-carousel-wrapper .shop-product-detail-carousel__panel {
        max-width: 100%;
    }
}

.shop-product-detail-button {
    height: 100%;
    margin-left: 10px;
    margin-right: 10px;
}

.shop-detail-carousel-button-wrapper {
    max-width: 500px;
}

.shop-detail-carousel-button-wrapper .shop-button {
    width: 100%;
    max-width: 100%;
}

.shop-detail-carousel-button-wrapper-active {
    width: 100%;
}

.shop-detail-carousel-button-wrapper-active button {
    background-color: var(--CTA-button-color);
    border-color: var(--CTA-button-color);
}

.shop-detail-carousel-button-wrapper-active button:hover {
    background-color: white;
    color: var(--CTA-button-color);
}


.shop-product-detail-button_icon-x-small {
    padding: 0;
}

.shop-product-detail-button_icon-border-filled {
    border: 1px solid #ffffff;
    border-radius: 3px;
    background-color: #ffffff;
    --slds-c-icon-color-foreground-default: var(--brand-color);
}

.shop-product-detail-button_icon-border-filled:hover {
    background-color: #d8dde6;
    --slds-c-icon-color-foreground-default: var(--brand-color);
}

button:disabled .shop-product-detail-button_icon-border-filled:hover {
    background-color: var(--brand-color) !important;
    --slds-c-icon-color-foreground-default: white !important;
}

.shop-product-detail-text-color_default {
    color: #1b1f23;
}

.shop-product-detail-carousel-center-items {
    justify-content: center;
}

.shop-product-detail-carousel-left-align-items {
    justify-content: flex-start !important;
}



.shop-product-detail-carousel-item-with-border {
    border: 2px solid var(--brand-color);
    padding-left: 20px;
    padding-right: 20px;
}

.shop-product-detail-carousel-item-without-border {
    border: 2px solid var(--background-color-white);
    padding-left: 20px;
    padding-right: 20px;
}

.shop-product-detail-nav {
    width: 40px;
    height: 100%;
}

.shop-product-detail-navigation {
    padding-top: 20px;
}

.shop-product-detail-navigation a {
    color: var(--brand-color);
    font-size: var(--Paragraph-big-font-size);
}

.shop-product-detail-carousel-content-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}

.shop-grid-col-carousel:first-child p {
    color: white;
}

/* 6.92.2 Shop Detail Rec Carousel */

.shop-product-detail-rec-carousel-wrapper-placeholder {
    margin-top: 70px;
    margin-bottom: 70px;
}

/*.shop-product-detail-image-container-rec-carousel {
    max-width: max-content;
    margin-right: 20px;
}*/

.shop-product-detail-rec-carousel-wrapper {
    margin-top: 70px;
    background-color: var(--background-color);
    margin-bottom: 70px;
    padding-bottom: 70px;
}

.shop-product-detail-rec-carousel-wrapper .shop-grid-col-carousel:first-child p {
    color: var(--text-color);
}

.shop-product-detail-rec-carousel-wrapper .my-carousel-navigation-button {
    position: relative;
    margin: auto 0px;
    width: 40px;
}

.shop-product-detail-rec-carousel-wrapper .my-carousel-button-prev {
    left: 0px;
}

.shop-product-detail-rec-carousel-wrapper .my-carousel-button-next {
    right: 0px;
}

@media (max-width: 1201px) {

    .shop-product-detail-rec-carousel-wrapper .my-carousel-navigation-button {
        position: absolute;
        bottom: 7%;
        margin: unset;
    }

    .shop-cart-prodname>p,
    .shop-overlay-prodname>p,
    .shop-item-prodname>p {
        min-height: 70px;
    }

    .shop-product-detail-carousel-wrapper .my-carousel-navigation-button {
        position: absolute;
        top: 1060px;
    }

    .shop-product-detail-carousel-wrapper .my-carousel-navigation-button {
        position: absolute;
    }

    .shop-product-detail-rec-carousel-wrapper .my-carousel-button-prev,
    .shop-product-detail-carousel-wrapper .my-carousel-button-prev {
        left: calc(50% - 50px);
    }


}

@media (max-width: 767px) {


    .shop-product-detail-rec-carousel-wrapper .my-carousel-navigation-button {
        bottom: 210px;
    }
}

@media (max-width: 1024px) {
    .shop-product-detail-carousel-wrapper .my-carousel-navigation-button {
        position: absolute;
        top: 1040px;
        /*top: 1100px;*/
    }
}

@media (max-width: 500px) {
    .shop-product-detail-carousel-wrapper .my-carousel-navigation-button {
        position: absolute;
        top: 1460px;
        /*top: 1100px;*/
    }
}

@media (max-width: 426px) {
    .shop-product-detail-carousel-wrapper .my-carousel-navigation-button {
        position: absolute;
        /*top: 1240px;*/
        top: 1520px;
    }
}

.shop-product-detail-rec-carousel-header {
    padding-top: 50px;
    display: flex;
    justify-content: center;
    padding-bottom: 50px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center
}

.shop-product-detail-rec-carousel-item-text p {
    color: var(--text-color);
}

.shop-product-detail-rec-carousel-header p {
    font-size: var(--h2-font-size);
}

.shop-product-detail-rec-button_icon-border-filled {
    border: 1px solid var(--background-color);
    border-radius: 3px;
    background-color: var(--background-color);
    --slds-c-icon-color-foreground-default: var(--brand-color);
}

.shop-product-detail-rec-button_icon-border-filled:hover {
    background-color: #d8dde6;
    --slds-c-icon-color-foreground-default: var(--brand-color);
}

/* Rec Carousel PP */
.shop-product-detail-rec-container {

    max-width: 300px;
    margin: auto;
    justify-content: space-between;

}

.shop-product-detail-rec-container-inner>.shop-product-detail-rec-carousel-item-text>h4 {
    min-height: 120px;
}

.shop-product-detail-rec-container-inner:hover>.shop-product-detail-rec-carousel-item-text>h4 {
    color: var(--brand-color);
}

.shop-product-detail-rec-container-inner:hover {
    cursor: pointer;
}

.shop-product-detail-image-container-rec-carousel {
    max-width: 100% !important;
    height: 200px;
    background: #fff;
    justify-content: center;
    align-items: center;
    display: flex;
    margin: 0 auto 20px auto;

}

.shop-product-detail-image-container-rec-carousel img {
    max-height: 180px;
}


.shop-product-detail-rec-carousel__panels {
    display: flex;
    align-items: center;
    vertical-align: top;
    white-space: nowrap;
    justify-content: center;
}



.shop-product-detail-rec-carousel-item-text {
    padding-top: 15px;
}

.shop-product-detail-rec-nav {
    width: 30px;
    height: 100%;
}

.shop-product-detail-rec-carousel-wrapper .shop-product-detail-button_icon-border-filled {

    background-color: var(--background-color);
    border: 0;
}




/* ***** MD Standard Styles ***** */

/* ***** MD Main Components ***** */



/* Tabler Header Column Color and css*/
.md-Table-No-Rows table>thead .slds-th__action {
    background-color: var(--brand-color);
    color: var(--background-color-white);
    font-size: 10px;
    font-family: var(--font-family-Normal) !important;
    font-weight: var(--font-weight-500);
    width: 100%;
}

/* Tabler Header Column hover color and css*/
.md-Table-No-Rows table>thead .slds-th__action:hover {
    background-color: var(--brand-color);
    color: var(--background-color-white);
    font-size: 10px;
    font-family: var(--font-family-Normal) !important;
    font-weight: var(--font-weight-500);
    width: 70%;
}

/* Tabler Header Column Color and css*/
.md-Table table>thead .slds-th__action {
    background-color: var(--brand-color);
    color: var(--background-color-white);
    font-size: 10px;
    font-family: var(--font-family-Normal) !important;
    font-weight: var(--font-weight-500);
    width: 100%;
}

/* Tabler Header Column hover color and css*/
.md-Table table>thead .slds-th__action:hover {
    background-color: var(--brand-color);
    color: var(--background-color-white);
    font-size: 10px;
    font-family: var(--font-family-Normal) !important;
    font-weight: var(--font-weight-500);
    width: 70%;
}

.md-Table .md-customTableRowColumHeader .slds-truncate {
    display: block;
    overflow: hidden;
}

.md-Table tbody tr:hover {
    cursor: pointer;
}

.md-Table {
    /*height: 54vh !important;
    margin-bottom: 30px;*/
    /* margin-left: -4vw; */
    /*scrollbar-color: var(--brand-color) var(--background-color-white);*/
    font-size: 14px;
}

.md-Table table {
    width: 100%;
    table-layout: fixed;
}

.md-Table .md-table-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.md-Table table th.date.md-customTableRowColumHeader {
    width: 90px;
}

.md-Table table th.string.md-customTableRowColumHeader {
    width: auto;
}

.md-Table table th.currency.md-customTableRowColumHeader {
    width: 130px;
}

.md-Table table th.detailView.md-customTableRowColumHeader {
    width: auto;
}

.md-Table table th.preview.md-customTableRowColumHeader {
    width: 55px;
}

.md-Table table th.string.md-customTableRowColumHeader.groupDocumentNumberList__c {
    width: 100px;
}




/*div.md-Table div.slds-scrollable_y {
    max-height: 0% !important;
    overflow: auto !important;
    overflow-y: auto !important;
    height: 45vh !important;
    position: static !important;
}*/

.md-Table-No-Rows {
    width: 80vw;
    left: 4.5vw;
    position: relative;
}

.md-Table-Rows:hover {
    background-color: var(--brand-color-light);
}

.md-customTableRowHeader {
    border-collapse: separate;
    border-top: var(--lwc-borderWidthThin, 1px) solid var(--brand-color);
    border-bottom: var(--lwc-borderWidthThin, 1px) solid var(--brand-color);
}

th.md-customTableRowColumHeader {
    border-right: solid var(--brand-color) 1px !important;
    background-color: var(--brand-color) !important;
    color: var(--background-color-white) !important;
}

.md-Table td.groupBruttoDisplay__c {
    text-align: right;
    padding-right: 20px;
}

.md-main .md-Table .md-customTableRowColumHeader .slds-icon_container {
    position: absolute;
    left: -7px;
}

.md-customTableRowColumHeaderSort {
    color: var(--background-color-white) !important;
    text-decoration: none;
}

.md-main {
    /* Display & Box Model */
    max-width: 1340px;
    margin: 0 auto 0 auto;
    padding: 0 auto;
}

.md-main td .slds-form-element .slds-checkbox [type=checkbox]+.slds-checkbox__label .slds-checkbox_faux {
    margin-top: 5px;
}

.md-filter-toggle {
    border: 0;
    background: none;
    color: #516771;
    margin-top: -10px;
    margin-left: 10px;
    font-family: 'Roboto-Regular';
    font-size: 12pt;
    color: var(--brand-color);
    position: relative;
}

.md-filter-icon {
    border: 0;
    display: inline-block;
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-size: 60% 60%;
    margin-bottom: -16px;
    background-image: var(--md-filter-icon);
}

.md-download-icon {
    cursor: pointer;
    border: 0;
    display: inline-block;
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-size: 85% 85%;
    background-image: var(--md-download-icon);
}

.md-preview-link {
    border: none;
    background: var(--background-color-white);
    color: var(--brand-color);
    margin-left: -5px;
    margin-top: 5px;
}

.md-chevrondown-icon {
    border: none;
    line-break: auto;
    background-image: var(--md-chevrondown-icon);
    background-size: 12px 12px;
    background-repeat: no-repeat;
    background-position-x: left;
    color: black;
}


.my-md-filter .md-dropdown {
    width: 100% !important;
}

.my-md-filter .md-dropdown .md-listbox-option {
    display: flex;
    justify-content: start;


}

.my-md-filter .md-dropdown .md-combobox-label {
    justify-content: start;
    padding: 3px 3px 3px 0px;
    letter-spacing: 0.05rem;
    margin-left: 0;
}

.my-md-filter .md-dropdown .slds-media__figure {
    /*display: none;*/
    margin-right: 0;
    padding: 5px;


}

.comm-page-custom-my-document .siteforceContentArea .comm-layout-column .ui-widget:not(:last-child) {
    margin: 0px;
}

.comm-page-custom-my-document .shop-search-filter-info-overlay,
.comm-page-custom-my-document .shop-cart-main {
    height: 0;
}

.comm-page-custom-my-document .shop-cart-info-screen-visible.shop-cart-order {
    border-bottom: 0;
}


.md-filter-input .slds-input {
    border: solid var(--brand-color) 1px !important;
    height: 5vh !important;
    width: 20vw !important;
    left: 2vw !important;
    position: sticky !important;
    margin-top: 5px !important;
}

.slds-input {
    font-size: var(--Paragraph-medium-font-size);
    letter-spacing: 0.05rem;
    color: var(--text-color);
}

.md-filter-input .slds-combobox__input {
    border: solid var(--brand-color) 1px !important;
    height: 5vh !important;
    width: 20vw !important;
    left: 2vw !important;
    position: sticky !important;
    margin-top: 20px !important;
}

.md-big-button .slds-button_neutral {
    border: solid var(--brand-color) 1px !important;
    height: 5vh !important;
    width: 20vw !important;
    margin-left: -2vw !important;
    position: sticky !important;
    outline: unset !important;
    margin-top: 10px !important;
    background-color: var(--brand-color) !important;
    color: var(--background-color-white) !important;
    font-size: 20px !important;
}

.md-filter-input .slds-icon_container {
    margin-right: 3.5vw !important;
    margin-top: 0px;
}

.md-filter-input .md-combobox-Icon {
    margin-right: 0.5vw !important;
    margin-top: 0px;
    margin-left: 0.5vw !important;
    --slds-c-icon-color-foreground-default: var(--brand-color);
}

.md-listbox-option .slds-icon {
    fill: var(--brand-color) !important;
}

.md-filter-input .slds-input__icon {
    margin-right: 3.5vw !important;
}

.md-rows-checkbox-column {
    display: none;
}

.md-rows-checkbox-input {
    width: 15px;
}

.md-allRows-checkbox-input .slds-checkbox .slds-checkbox_faux {
    --slds-c-checkbox-shadow-focus: none;
    --slds-c-checkbox-mark-color-foreground: var(--brand-color);
    border-color: var(--brand-color);
    display: block;
    position: absolute;
    /* width: 15px; */
}

.md-rows-checkbox-input .slds-checkbox .slds-checkbox_faux {
    --slds-c-checkbox-shadow-focus: none;
    --slds-c-checkbox-mark-color-foreground: var(--brand-color);
    border-color: var(--brand-color);
    display: block;
    position: absolute;
    /* width: 15px; */
}

.md-checkbox-input-positioning {
    width: 30px !important;
    padding-top: 0px !important;
    padding-bottom: 15px !important;
}

.md-button {
    --slds-c-button-brand-color-background: var(--brand-color);
    --slds-c-button-brand-color-border: var(--brand-color);
    --slds-c-button-brand-color-text: var(--background-color-white);
}

.md-main-mass-download-button {
    display: none;
}



.md-main-subtitle {
    display: none;
}

.md-main-title {
    /*margin: 20px;*/
    margin-bottom: 20px;
    margin-top: 20px;
    margin-right: 20px;
    color: var(--text-color);
    font-family: var(--font-family-Light) !important;
    font-size: var(--h3-font-size);
    font-weight: var(--font-weight-300);
}

.md-search-bar .icon {
    bottom: 33px;
    position: relative;
    left: 92%;
    display: inline-block;
    min-width: 25px;
    min-height: 25px;
    cursor: pointer;
    border: 0;
    background-repeat: no-repeat;
    background-size: 65% 65%;
    background-image: var(--md-search-bar-icon);
}

.shop-text-color .md-detail-view-desktop {
    display: inline;
}

.md-detail-view-desktop {
    display: none;
}

.md-search-filter-button {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 15px;
    margin-top: 5px;
    max-width: 250px;

}

.md-search-filter-button .shop-search-filter-toggle-button {
    min-width: 250px;
}

/* myADM */

.adm-main {
    min-height: calc(100vH - 194px);
    margin-top: 110px;
}

.adm-content-wrapper {
    margin-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    display: flex;
    flex-direction: column;
}

.adm-container {
    display: flex;
    height: 100%;
}

.adm-content-headline {
    padding-bottom: 10px;
}

.adm-main-carousel__panel {
    display: inline-block;
    width: 100%;
    box-shadow: 0px 5px 10px 3px #ccc;
}

.adm-main-carousel-task__panel {
    display: flex;
    width: 100%;
    box-shadow: 0px 5px 10px 3px #ccc;

    background: var(--background-color);
}

.self-service-carousel-task__panel {
    display: inline-block;
    width: 100%;
    /* box-shadow: 0px 5px 10px 3px #ccc; */
    background: var(--background-color);
}

.self-service-profile-flex-gap {
    gap: 15px;
}

.self-service-main .slds-file-selector__body {
    letter-spacing: 0;
}

.self-service-profile-border {
    border: 1px solid var(--brand-color);
}

.self-service-profile-padding {
    padding: 0px;
}

.self-service-main .shop-output-title {
    text-align: left;
}

.self-service-main .shop-output-value {
    padding-left: 0px;
    text-align: left;
}

.self-service-price-list-item {
    padding: 10px 20px;
    color: white;
    text-align: left;
}

.self-service-price-list-item>a {
    color: white;
}

.self-service-price-list-background {
    background-color: var(--brand-color) !important;
}

.self-service-overlay-content h4 b {
    font-weight: var(--font-weight-500);
}

.self-service-overlay-content textarea,
.self-service-overlay-content input,
.self-service-overlay-content {
    letter-spacing: 0.05rem;
}

.self-service-overlay-content textarea,
.self-service-overlay-content input {
    font-size: var(--Paragraph-big-font-size);
}

.self-service-overlay-content .shop-cart-item-edit-label {
    width: 140px;

}

.self-service-main-carousel-wrapper-header {
    display: flex;
    padding: 20px 0;
}

.self-service-main-carousel-wrapper-sub-header {
    color: var(--text-color);
    font-family: var(--font-family-Light) !important;
    font-size: var(--Paragraph-big-font-size);
    font-weight: var(--font-weight-300);
}

.adm-task-textarea-content {
    resize: vertical;
    width: 100%;
    padding: 10px;
    height: 100%;
    border-color: var(--brand-color);
    font-size: 16px;
    outline: none;
}

.adm-task-textarea-content:focus {
    border: 2px solid var(--brand-color);
}

.adm-task-button-wrapper {
    display: flex;
    justify-content: center;
}

.adm-panel-text-styling {
    overflow-wrap: break-word;
    color: var(--brand-color) !important;
}

/** Consent **/
.consent-modal .my-cms-single-display-container {
    /*display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 20px 25px;*/
    padding: 0px !important
}



/*+ HOME **/
.my-home-main {
    letter-spacing: 0.05rem;
}

.my-home-main .shop-button-brand {
    max-width: 300px;
}

.my-home-main .shop-start-header {
    min-height: 299px;
    width: 100%;
    text-align: center;
    /*background-color: var(--background-color);*/
    background-image: var(--shop-start-header-icon);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.my-home-main-greetings .my-home-greetings-container {
    width: 100%;
}


.my-home-main .my-home-greetings-container {
    margin-top: 20px;

}

.my-home-main .my-home-greetings-container .my-home-greetings-content {

    justify-content: stretch;
    gap: 20px;
}

.my-home-main {
    padding: 0px;
}

.my-home-orders {
    margin-top: 20px;
}

.my-home-greetings-container {
    background-color: var(--background-color);
    padding: 20px 0px;

}

.my-home-greetings-container .my-home-greetings-container-col {
    align-items: stretch;
}

.my-home-main .my-home-greetings-container .my-home-greetings-image {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.my-home-main .md-customTableRowColumHeader .shop-truncate {
    /*overflow: visible;*/
    overflow: hidden;
    display: blocK;
}

.my-home-main .md-customTableRowColumHeader .slds-icon_container {
    position: absolute;
    left: -7px;
}


.my-home-main .md-Table table {
    /*table-layout: auto;*/
    table-layout: fixed;
}

.my-home-main .md-Table table .md-customTableRowColumHeader.Name {
    width: 98px;
}


.my-home-main .md-customTableRowColumHeader.groupStatus__c {
    width: 170px;
}

.my-home-main .my-home-greetings-container .my-home-greetings-col-text {
    padding-top: 20px;
    padding-bottom: 40px;
    position: relative;
}

.my-home-main .my-home-greetings-container .my-home-greetings-col-text .my-home-greetings-col-text-button {
    position: absolute;
    bottom: 0px;
    width: 100%;
}

.my-home-main .my-home-greetings-container .my-home-greetings-col-text .shop-button {
    max-width: 100%;
}

.my-home-main .my-home-greetings-container p {
    font-size: var(--Paragraph-big-font-size);
}

.my-home-main .my-home-content-container {
    margin-top: 50px;
    gap: 15px;
    justify-content: space-between;
}

.my-home-greetings-close-btn>.slds-button {
    padding: 10px;
}

.home-data-table-detail-view .shop-output-title {
    width: 160px;
}

.my-home-button-section {
    padding: 25px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.my-home-icon-check {
    display: flex;
    align-items: center;
    justify-content: center;
    /* background-repeat: no-repeat; */
    /* background-size: 85% 85%; */
    height: 60px;
    width: 60px;
    background-size: 100% 100%;
    background-image: var(--shop-confirmation-icon-check);
}

.my-home-icon-check-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 40px;
}

.my-home-icon-center {
    width: 100%;
    display: flex;
    justify-content: center;
}

.my-home-carousel__panel {
    display: inline-block;
    width: 100%;
    box-shadow: 0px 5px 10px 3px #ccc;
}

.my-home-cms-button-wrapper {
    width: 50%;
    padding: 10px 0;
}

.my-cms-single-display-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 20px 25px;
}

.my-cms-single-display-container .adm-content-wrapper {
    padding: 0px;
    margin: 0px;
}

.my-home-main .my-cms-single-display-container span p:first-child {
    font-size: .75rem;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: .75rem;
}

.my-home-main .my-cms-single-display-container span p:nth-child(2) {
    font-size: var(--h4-font-size);
}

.my-home-main .my-cms-single-display-container li,
.my-home-main .my-cms-single-display-container ul {
    font-size: var(--Paragraph-medium-font-size);
    color: var(--text-color);
}

.my-home-main .my-cms-single-display-container ul,
.my-home-main .my-cms-single-display-container ol {
    margin-top: 10px;
}

.my-cms-single-display-button {
    color: var(--brand-color);
    font-weight: var(--font-weight-500);
    text-decoration: none;
    letter-spacing: .075rem;
    -webkit-hyphens: none;
    hyphens: none;
    border: none;
    padding: 0px;
    background: white;
    font-family: var(--font-family-Normal);
    font-size: var(--Paragraph-medium-font-size);
    text-align: left;
}

.my-cms-single-display-button:hover {
    text-decoration: underline;
}

.my-cms-single-display-button:after {
    position: relative;
    bottom: .15em;
    display: inline-block;
    width: .3em;
    height: .3em;
    content: "";
    border-width: .05em .05em 0 0;
    border-style: solid;
    left: .3em;
    transform: rotate(45deg);
    border-color: var(--brand-color);
}

.my-home-table {
    height: 54vh !important;
    margin-bottom: 30px;
    /* margin-left: -3vw; */
    scrollbar-color: var(--brand-color) var(--background-color-white);
}

.my-home-data-table-header-wrapper {
    height: 225px;
    border: solid var(--brand-color) 1px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.my-home-data-table-header-container {
    display: flex;
    background-color: var(--brand-color);
    height: 43px;
    color: white;
    justify-content: space-around;
    align-items: center;
    font-size: var(--Paragraph-medium-font-size);
}

.my-home-data-table-header-wrapper>div>a {
    color: var(--brand-color);
    font-size: var(--Paragraph-medium-font-size);
}


.my-home-orderdetail-main {
    letter-spacing: 0.05rem;
}

/***Self Service***/
.self-service-main {
    min-height: calc(100vH - 194px);

}

.self-service-main .shop-start-main-carousel-order {
    margin-top: 35px;
}

.self-service-parnter-Standard {}

.self-service-parnter-Default {
    border: 1px solid var(--brand-color);
}

.self-service-parnter-default-icon {
    border: 1px solid var(--brand-color);
    /* float: right; */
    /* display: inline-block; */
    width: auto;
    /* box-shadow: 0px 5px 10px 3px #ccc; */
    background: var(--background-color-white);
    position: relative;
    right: -3%;
    font-size: 13px;
    text-align: center;
    color: var(--brand-color);
    top: -3%;

    float: inline-end;
    margin-right: -8px;
    padding: 0px 10px;
    margin-top: 6px;
}

.self-service-profile-pic {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.slds-file-selector__button {
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-image: var(--shop-icon-write-icon) !important;
    cursor: pointer;
}


.slds-file-selector__dropzone {

    padding: 1px !important;
    border: none !important;
    border-radius: none !important;
}

/* remove the "or drop files" label from the right of the lightning:input type file */
.slds-file-selector__dropzone .slds-file-selector__text {
    font-size: 0 !important;
    padding: none !important;
    border: none !important;
    border-radius: none !important;
}

/* insert the text "or drop file" into the label */
.slds-file-selector__dropzone .slds-file-selector__text:after {
    content: '' !important;
    font-size: .8125rem !important;
    color: var(--brand-color) !important;
    padding: none !important;
    border: none !important;
    border-radius: none !important;
}

/* remove the "Upload Files" text from the button of the lightning:input type file */
.slds-file-selector__dropzone .slds-file-selector__button {
    font-size: 0 !important;
    padding: none !important;
    border: none !important;
    border-radius: none !important;
    background-color: #fff;
    margin-bottom: -0.5px;
}

/* remove the "Upload Files" text from the button of the lightning:input type file */
.slds-file-selector__dropzone .slds-file-selector__button svg {
    display: none !important;
}

/* insert the text "Upload File" into the button of the lightning:input type file */
.slds-file-selector__dropzone .slds-file-selector__button:after {
    content: '' !important;
    font-size: .8125rem !important;
    color: var(--brand-color) !important;
    padding: none !important;
    border: none !important;
    border-radius: none !important;
}

/*+ HOME **/
.self-service-main .shop-start-header {
    min-height: 299px;
    width: 100%;
    text-align: center;
    /*background-color: var(--background-color);*/
}

/* ***** my Login Main Components ***** */
.my-login-info-section {}

.my-login-main-image {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: var(--brand-color);
    overflow: hidden;
}

.my-login-main-image img {
    height: 50px;
    width: 50px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.my-login-carousel {
    display: none;
}

.my-login-info-after-bold {
    font-family: var(--font-family-Normal) !important;
    font-weight: var(--font-weight-500);
}

.my-login-email.shop-button.shop-button-action,
.my-login-phone.shop-button.shop-button-action {
    background-position: center;
    background-size: auto 25px;
    background-repeat: no-repeat;
    height: 50px;
}

.my-login-email.shop-button.shop-button-action {
    background-image: url('/sfsites/c/resource/myIcons/myIcons/Icon_customer_platform_WHITE_240422_mail.png');
}

.my-login-phone.shop-button.shop-button-action {
    background-image: url('/sfsites/c/resource/myIcons/myIcons/Icon_customer_platform_WHITE_241014_phone.png');
}

.my-login-email.shop-button.shop-button-action:hover {
    background-image: url('/sfsites/c/resource/myIcons/myIcons/Icon_customer_platform_GREEN_240422_mail.png');
}

.my-login-phone.shop-button.shop-button-action:hover {
    background-image: url('/sfsites/c/resource/myIcons/myIcons/Icon_customer_platform_GREEN_241014_phone.png');
}

.salesforceIdentityLoginBody2 .cCenterPanel {
    text-align: left;
    min-width: 280px;
    max-width: 390px;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    display: inline-block;
    position: relative;
    font-family: var(--lwc-fontFamily, Roboto);
    text-decoration: none;
    vertical-align: middle;
    z-index: 0;
    padding: 0px 20px;
}

.salesforceIdentityLoginBody2 .cCenterPanel:before {
    display: none;
}

.comm-page-login-home .comm-layout-column {
    max-width: 1920px;
    margin: auto;
}

.comm-page-login-home .salesforceIdentityLoginBody2 {
    background: #fff !important;
}

.comm-page-login-home .salesforceIdentityLoginForm2 {
    width: 100%;
}

.salesforceIdentityLoginBody2 .salesforceIdentityForgotPassword2 .loginButton:hover,
.comm-page-login-home .salesforceIdentityLoginForm2 .loginButton:hover {
    background-color: var(--background-color-white);
    color: var(--brand-color);
    font-weight: 300;
    border-color: var(--brand-color);
}

.salesforceIdentityLoginBody2 .salesforceIdentityForgotPassword2 .loginButton:hover .label,
.comm-page-login-home .salesforceIdentityLoginForm2 .loginButton:hover .label {
    color: var(--brand-color);
}


.comm-page-login-home .salesforceIdentityLoginForm2 div:nth-of-type(4) {
    text-align: right;
}

.salesforceIdentityForgotPassword2 .inputIcon,
.salesforceIdentityLoginForm2 .inputIcon {
    display: none;
}

.comm-page-login-home .my-login-info-section,
.comm-page-login-home .my-login-info-after,
.comm-page-login-home .my-login-footer,
.comm-page-login-home .salesforceIdentityLoginForm2 {
    font-family: 'Roboto-Light' !important;
}

.comm-page-login-home .cHeaderPanel {
    background: #fff !important;
}

.salesforceIdentityLoginBody2 .salesforceIdentityForgotPassword2 .loginButton,
.comm-page-login-home .salesforceIdentityLoginForm2 .loginButton {
    margin-top: 0px !important;
}

.salesforceIdentityLoginBody2 .salesforceIdentityForgotPassword2 .loginButton,
.comm-page-login-home .salesforceIdentityLoginForm2 .slds-button {
    /* Positioning */
    position: relative;
    /* Display & Box Model */
    align-items: center;
    width: 100%;
    padding-left: 0%;
    padding-right: 0%;
    padding-top: 3px;
    padding-bottom: 3px;
    border-radius: 3px;
    /* Text */
    font-size: 18px;
    font-weight: 500;
    line-height: 44px;
    text-align: center;
    font-family: 'Roboto-Light' !important;
}

.salesforceIdentityLoginBody2 .salesforceIdentityForgotPassword2 .loginButton,
.comm-page-login-home .salesforceIdentityLoginForm2 .uiButton.slds-button--brand {
    /*border: 1px solid var(--brand-color);
    background-color: var(--brand-color);
    color: var(--background-color-white);*/
}

.salesforceIdentityLoginBody2 .salesforceIdentityForgotPassword2 .inputContainer,
.comm-page-login-home .salesforceIdentityLoginForm2 .inputContainer {
    /* Display & Box Model */
    /*height: 46px;*/
    width: 100%;
    /*padding: 0 1rem 0 0.75rem;*/
    border: solid 1px var(--brand-color);
    border-radius: 3px;
    font-family: 'Roboto-Light' !important;
}

.salesforceIdentityLoginBody2 .salesforceIdentityForgotPassword2 .inputContainer:focus,
.comm-page-login-home .salesforceIdentityLoginForm2 .inputContainer:focus {
    box-shadow: none;
}

.salesforceIdentityLoginBody2 .salesforceIdentityForgotPassword2 .inputBox,
.comm-page-login-home .salesforceIdentityLoginForm2 .inputBox {
    font-family: 'Roboto-Light' !important;
    margin-left: 10px;
    margin-top: 3px;
    border: 0 solid transparent;
    width: 70%;
    -webkit-appearance: none;
    font-size: 16px;
    padding: 1px 2px;
    line-height: normal;
    min-height: unset;
}

.comm-page-forgot-password .contentRegion {
    width: 100% !important;
    max-width: 400px;
}







/* ***** Login Main Components END  ***** */

/* Button Brand */
.md-button-brand {
    border: 1px solid var(--brand-color);
    background-color: var(--brand-color);
    color: var(--background-color-white);
}

/* Button Brand Inverse */
.md-button-brand-inverse {
    border: 1px solid var(--brand-color);
    background-color: var(--background-color-white);
    color: var(--brand-color);

}


/** CUSTOM TABLE **/
a:hover .md-sortRowIcon {
    display: inline-block;
    float: right;
}

.md-sortRowIcon {
    display: none;
}

.pulse-button {
    transform: scale(1);
    animation: pulse 3s infinite;
}

.md-table-header {
    position: relative;
    z-index: 1;
}

@keyframes pulse {
    0% {
        transform: scale(0.95);
    }

    70% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(0.95);
    }
}

.progress-bar-container {
    flex-grow: 1;
    /* This will make the progress bar take up remaining space */
    margin-left: 20px;
    /* Adjust this value according to your preference */
}

.md-download-text {
    margin-left: 20px;
}

.loader {
    color: var(--brand-color);
    display: inline-block;
    position: relative;
    font-size: 21px;
    font-family: Arial, Helvetica, sans-serif;
    box-sizing: border-box;
}

.loader::after {
    content: '';
    width: 5px;
    height: 5px;
    background: currentColor;
    position: absolute;
    bottom: 10px;
    right: -5px;
    box-sizing: border-box;
    animation: animloader 1s linear infinite;
}

@keyframes animloader {
    0% {
        box-shadow: 10px 0 var(--brand-color), 20px 0 var(--brand-color);
    }

    50% {
        box-shadow: 10px 0 rgba(255, 255, 255, 0), 20px 0 var(--brand-color);
    }

    100% {
        box-shadow: 10px 0 rgba(255, 255, 255, 0), 20px 0 rgba(255, 255, 255, 0);
    }
}

.md-big-button .slds-button_neutral {
    border: solid var(--brand-color) 1px !important;
    height: 5vh !important;
    width: 20vw !important;
    margin-left: -2vw !important;
    position: sticky !important;
    outline: unset !important;
    margin-top: 10px !important;
    background-color: var(--brand-color) !important;
    color: white !important;
    font-size: 20px !important;
}

/* ***** MD Pagination***** */
.md-pagination {
    min-width: 295px;
    margin-top: 25px;
    display: flex;
    align-items: center;
    justify-content: start;
    white-space: nowrap;
}

.md-pagination-select-rows {
    min-width: 295px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
}

.md-pagination-select-rows-combobox {
    width: 70px;
}

.md-combobox .md-combobox-label {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
    margin: auto;
    font-size: var(--Paragraph-medium-font-size);
    cursor: pointer;
    color: var(--text-color);

}

.md-combobox-option {
    display: flex;
    align-items: flex-start;
}

.md-combobox-container {
    display: flex;
    flex-direction: column;
    position: relative;
}

.md-combobox {
    position: static;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

.md-pagination-select-rows-combobox .md-dropdown {
    width: 70px;
    min-width: 70px;
}


button.md-ersteSeite-icon:hover:disabled,
.md-ersteSeite-icon {
    cursor: pointer;
    border: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 5px;
    background-repeat: no-repeat;
    background-size: 25px;
    border-radius: 13px;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, .1);
    background-color: var(--background-color-white);
    background-image: var(--md-first-page-icon);
}

button.md-vorherigeSeite-icon:hover:disabled,
.md-vorherigeSeite-icon {
    cursor: pointer;
    border: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 10px;
    background-repeat: no-repeat;
    background-size: 25px;
    border-radius: 13px;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, .1);
    background-color: var(--background-color-white);
    background-image: var(--md-previous-page-icon);
}

button.md-naechsteSeite-icon:hover:disabled,
.md-naechsteSeite-icon {
    margin-left: 10px;
    cursor: pointer;
    border: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    background-repeat: no-repeat;
    background-size: 25px;
    border-radius: 13px;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, .1);
    background-color: var(--background-color-white);
    background-image: var(--md-next-page-icon);
}

button.md-letzteSeite-icon:hover:disabled,
.md-letzteSeite-icon {
    cursor: pointer;
    display: inline-block;
    border: 0;
    width: 25px;
    height: 25px;
    margin-left: 5px;
    background-repeat: no-repeat;
    background-size: 25px;
    border-radius: 13px;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, .1);
    background-color: var(--background-color-white);
    background-image: var(--md-last-page-icon);
}

.md-ersteSeite-icon:hover {
    fill: white;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
    background-image: var(--md-first-page-icon-white);
}

.md-vorherigeSeite-icon:hover {
    fill: white;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
    background-image: var(--md-previous-page-icon-white);
}

.md-letzteSeite-icon:hover {
    fill: white;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
    background-image: var(--md-last-page-icon-white);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
}

.md-naechsteSeite-icon:hover {
    fill: white;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
    background-image: var(--md-next-page-icon-white);
}


.md-currentSite {
    border: solid var(--brand-color) 0.55px !important;
    border-radius: 5px;
    width: 40px;
    display: inline-flex;
    height: 26px;
    margin-left: 10px;
    margin-right: 10px;
    justify-content: center;
    align-items: center;
}

.md-PageSize .icon {
    top: 2.7rem;
    display: inline-block;
    width: 26px;
    height: 26px;
    margin-top: -5px;
    margin-right: 2.3vw !important;
    border: 0;
    background-repeat: no-repeat;
    background-size: 85% 85%;
    background-image: var(--md-page-size-icon);
    cursor: pointer;
}

.md-pages-per-site {
    font-size: var(--Paragraph-medium-font-size);
}

/* 99. Header */

/* 99.1 Header - Logo */
.my-header-logo {
    display: inline-block;
    height: 34px;
    width: var(--my-header-logo-width);
    margin-top: 10px;
    margin-bottom: 0px;
    background-image: var(--my-header-logo);
    cursor: pointer;
    background-size: contain;
    background-repeat: no-repeat;
}

.shop-sub-header-content .shop-header-menu-item {
    margin-left: 100px;
    color: #516771 !important;
    font-weight: var(--font-weight-500);
    font-size: var(--Paragraph-big-font-size);
    font-family: var(--font-family-Normal) !important;
    letter-spacing: 0.05rem;
    line-height: 26.1px;
    hyphens: none;
    cursor: pointer;

}

.shop-sub-header-content .shop-header-menu-item.active {
    color: var(--brand-color) !important;
}

.shop-header {
    /* Positioning */
    position: fixed;
    z-index: 5;
    top: 0px;
    left: 0px;
    /* Display & Box Model */
    display: flex;
    height: 50px !important;
    width: 100%;
    /* Color */
    /*background-color: var(--brand-color);*/
    background-color: var(--dxp-g-brand);
    /* Text */
    /* Other */
}

.shop-header-boundary {
    display: flex;
    width: 100%;
    max-width: 1340px;
    margin-left: auto;
    margin-right: auto;
    justify-content: space-between;
    align-items: center;
    padding: 0 50px;
}

.shop-header-burger-menu {
    position: fixed;
    top: -100vH;
    left: 0px;
    right: 0px;
    bottom: 0px;
    width: 100%;
    height: 100vH;
    z-index: 1006;
    background: var(--background-color);
    transition: top 0.5s ease;

    /*-webkit-animation: fadeinout 4s linear forwards;
    animation: fadeinout 4s linear forwards;
    opacity: 0;
    */
}

.shop-header-burger-menu-visible {
    top: 0px;
}

.shop-header-burger-menu-close {
    height: 50px;
    width: 100%;
    padding: 15px;
    text-align: right;
}

.shop-header-burger-menu-logo {
    height: 100px;


}

.shop-header-burger-menu-items {
    height: 400px;
}

.shop-header-burger-menu-items .shop-header-menu-item {
    height: 50px;
    width: 100%;
    text-align: center;
    margin: auto;

}

.shop-header-burger-menu-items .shop-header-menu-item a {
    font-size: var(--Paragraph-big-font-size);
    color: var(--text-color);
    letter-spacing: 0.05rem;
}

.shop-header-burger-menu-items .shop-header-menu-item.active a {
    color: var(--brand-color) !important;
}

/*
@-webkit-keyframes fadeinout {
    50% {
        opacity: 1;
        z-index: 1005;
    }
}

@keyframes fadeinout {
    50% {
        opacity: 1;
        z-index: 1005;
    }
}*/



.shop-footer {
    /* Display & Box Model */
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    width: -webkit-fill-available;
    /* Color */
    background-color: var(--brand-color);
    /* Text */
    /* Other */
}

.shop-footer-navigation {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    gap: 15px;
    background-color: var(--brand-color);
    height: 50px;
}

.shop-footer-navigation a {
    color: white !important;
    font-family: var(--font-family-Normal) !important;
    font-size: var(--Paragraph-medium-font-size);
    font-weight: var(--font-weight-300);
    cursor: pointer;
}

.footer-links-container {
    display: flex;
    justify-content: center;
    width: 100%;
    max-width: 1400px;
    margin: 0px;
    padding-left: 20px;
    padding-right: 20px;
    gap: 25px;

}

.shop-footer a {
    color: white;
    font-size: var(--Paragraph-small-font-size);
}



.shop-footer a:hover {
    color: white;
    text-decoration: underline;
}

.my-text {
    text-align: center !important;
    left: 23vw !important;
    top: 60px !important;
}

/* Media queries */
@media (min-width: 500px) {

    .my-home-greetings-container .my-home-greetings-container-col {
        width: 100%;
    }

    .my-home-main .md-Table table .md-customTableRowColumHeader.Name {
        width: 118px;
    }

    .shop-cart {
        right: 9.9vw;
    }

    .shop-grid-col-2 {
        width: 16.66%;
    }

    .shop-grid-col-3 {
        width: 48.5%;
    }

    .shop-grid-col-4 {
        width: 50%;
    }

    .shop-grid-col-6 {
        width: 50%;
    }

    .shop-grid-col-10 {
        width: 83.33%;
    }

    .shop-grid-col-6:nth-child(even) {
        padding-left: 10px;
    }

    .shop-grid-col-6:nth-child(odd) {
        padding-right: 10px;
    }

    .shop-start-header-background {
        max-width: 990px;
        padding: 20px 50px;
        width: 80%;
    }


    .shop-cart-info-screen {
        width: 500px;
    }

    .shop-search-filter-info-screen {
        width: 500px;
    }

    .shop-cart-order {
        width: 500px;
    }

    .shop-overlay-content {
        width: 500px;

    }

    .shop-search-filter-order {
        width: 500px;
        background-color: var(--background-color);
    }

    .shop-product-detail-text {
        padding-left: 60px;
    }

    .shop-product-detail-header-wrapper {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        flex-wrap: nowrap;
        min-height: 270px;
        margin-bottom: 20px;
        /*padding-left: 20px;*/
    }

    .shop-product-detail-image-container {
        display: block;
        min-width: max-content;
        margin-right: 20px;
    }

    .shop-product-detail-image-container-mobile {
        display: none;
    }



    .shop-grid-col-carousel {
        width: 100%;
    }

    /*.shop-detail-main .shop-grid-col-carousel {
        width: calc(50% - 10px);
    }*/

    .shop-product-detail-carousel__panels {
        justify-content: center;
    }

    .shop-start-main-carousel-when-no-buttons {
        /* padding-left: 40px; */
    }

    .shop-shipping-content-wrapper .shop-output-value {
        display: flex;
        gap: 10px;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-family: var(--font-family-Light) !important;
        font-size: var(--Paragraph-big-font-size);
        font-weight: var(--font-weight-300);
    }


    .footer-links-container {
        display: flex;
        justify-content: flex-end;
        width: 100%;
        max-width: 1340px;
        margin: 0px;
        padding-left: 50px;
        padding-right: 50px;
        gap: 25px;
    }

    .md-Table {
        /*padding-left: var(--p-m-large);
        padding-right: var(--p-m-large);*/
        font-size: 18px;
        margin-top: 40px;
        ;
    }



    .md-rows-checkbox-column {
        display: revert-layer;
    }


    .md-Table table th.date.md-customTableRowColumHeader {
        width: 110px;
    }

    .md-Table table th.string.md-customTableRowColumHeader {
        width: auto;
    }

    .md-Table table th.currency.md-customTableRowColumHeader .md-Table table th.currency.md-customTableRowColumHeader {
        width: 130px;

    }

    .md-Table table th.detailView.md-customTableRowColumHeader {
        width: auto;
    }

    .md-Table table th.preview.md-customTableRowColumHeader {
        width: 60px;
    }

    .md-Table table th.string.md-customTableRowColumHeader.groupDocumentNumberList__c {
        width: 130px;
    }

    .md-Table table th.string.md-customTableRowColumHeader.groupBuildingSiteCity__c {
        width: 160px;
    }

    .md-Table table th.detailView.md-customTableRowColumHeader.groupRecordTyp__c {
        width: 150px;
    }

    .md-main-mass-download-button {
        display: flex;
        justify-content: flex-end;
        align-items: start;
        padding-right: 0px;
    }

    .adm-main-carousel__panel {
        display: inline-block;
        width: 48.5%;
        box-shadow: 0px 5px 10px 3px #ccc;
    }

    .my-home-carousel__panel {
        display: inline-block;
        width: 48.4%;
        box-shadow: 0px 5px 10px 3px #ccc;
    }



    .my-home-main .my-home-greetings-container .my-home-greetings-col-text {
        padding-top: 0px;
    }

}

.shop-silo-info-detail-wrapper {
    height: 441px !important;
}

@media (min-width: 768px) {

    .shop-confirmation-main,
    .shop-checkout-main,
    .md-main {
        /* Display & Box Model */
        max-width: 1340px;
        margin: 110px auto 0 auto;
        padding: 0 auto;
    }

    .my-home-greetings-container .my-home-greetings-container-col {
        width: calc(50% - 10px);
    }

    /*.my-home-main .my-home-greetings-container .my-home-greetings-image {
        height: 100%;
        width: 100%;
        max-height: auto;
        object-fit: cover;
    }*/



    .my-home-main {
        margin: 95px auto 0 auto;
        width: 100%;
        padding: 0px;
    }

    .shop-grid-col-3 {
        width: 49%;
    }

    .shop-grid-col-4 {
        width: calc(50% - 14px);
    }

    .shop-grid-col-6 {
        width: 50%;
    }

    .shop-grid-col-6:nth-child(even) {
        padding-left: 10px;
    }

    .shop-grid-col-6:nth-child(odd) {
        padding-right: 10px;
    }

    .shop-cart-info-screen {
        width: 500px;
    }

    .shop-search-filter-info-screen {
        width: 500px;
    }

    .shop-cart-order {
        width: 500px;
    }

    .shop-search-filter-order {
        width: 500px;
    }



    /*.shop-product-detail-technical-documentation-wrapper {
        padding-left: 60px;
    }*/

    .shop-product-detail-information {
        width: 50%;
    }

    .shop-product-detail-information-description-wrapper {
        padding-left: 20px;
        padding-right: 20px;
    }

    .shop-footer-navigation {
        /*display: none;*/
    }

    .shop-product-detail-header-wrapper {
        /*padding-left: 70px;*/
        flex-direction: row;
    }

    .comm-page-login-home .salesforceIdentityLoginForm2,
    .comm-page-login-home .my-login-info-after,
    .comm-page-login-home .my-login-info-section {

        padding-left: 40px;
        padding-right: 40px;
    }

    .shop-checkout-main-grid-container {
        flex-wrap: nowrap;
        margin-bottom: 50px;
    }

    .shop-silo-info-wrapper,
    .shop-silo-info-detail-wrapper {
        height: 441px !important;
    }

    .shop-silo-info-container {
        width: 65%;
    }

    .shop-silo-info-detail-container {
        width: 34%;
    }

    .shop-shipping-content-wrapper .shop-output-title {
        width: 140px;
    }

    .shop-checkout-main-grid-item {
        position: relative;
        min-height: 482px;
    }

    .shop-confirmation-icon {
        width: 240px;
    }

    .shop-confirmation-icon-text {
        width: calc(100% - 240px);
    }

    .shop-start-main-carousel__panels {
        /* display: inline-block; */
        display: flex;
        align-items: center;
        vertical-align: top;
        white-space: nowrap;
        justify-content: flex-start;
        gap: 30px;
        /* padding-left: 20px;
        padding-right: 20px; */
    }



    .shop-detail-main .shop-grid-col-carousel {
        width: calc(50% - 10px);
    }

}

@media (min-width: 862px) {

    /* my Login */
    .my-login-carousel {
        position: fixed;
        top: 0px;
        right: 0px;
        display: block;
        width: calc(100vw - 440px);
        max-width: calc(100vw - 440px);
        height: 100vh;
        margin-top: 0px;
        background: #fff;
    }

    .my-login-carousel img {
        object-position: var(--my-login-object-position);
    }

    .my-login-info-section,
    .my-login-footer,
    .my-login-info-after,
    .my-login-info-section {
        width: 33%;
        min-width: 400px;
        max-width: 450px;
    }

    .comm-page-login-home .salesforceIdentityLoginForm2 {
        width: 33%;
        min-width: 400px;
        max-width: 450px;
    }
}




@media (min-width: 900px) {

    .my-home-main .my-home-greetings-container .my-home-greetings-img {
        max-height: 468px;
    }

    .shop-grid-col-3 {
        width: 32%;
    }

    .shop-grid-col-4 {
        width: calc(33% - 11px);
    }

    .shop-product-detail-header-wrapper {
        /*padding-left: 170px;*/
        flex-direction: row;
    }

    .adm-main-carousel__panel {
        display: inline-block;
        width: 31%;
        box-shadow: 0px 5px 10px 3px #ccc;
    }

    .adm-main-carousel-task__panel {
        display: flex;
        width: 32%;
        box-shadow: 0px 5px 10px 3px #ccc;
        background: var(--background-color);
    }

    .self-service-carousel-task__panel {
        display: inline-block;
        width: 25%;
        /* box-shadow: 0px 5px 10px 3px #ccc; */
        background: var(--background-color);
        /* max-width: 300px;
        max-height: 330px; */
    }

    .shop-grid-col-self-service {
        width: 50%;
    }

    .self-service-profile-flex-gap {
        gap: 0px;
    }

    .self-service-profile-padding {
        padding: 0 20px;
    }


}

@media (min-width: 1024px) {

    .my-home-main .my-home-greetings-container .my-home-greetings-image {
        max-height: 416px;
    }

    .shop-text-color .md-detail-view-desktop {
        display: none;
    }

    .shop-sub-header {
        /* Positioning */
        position: fixed;
        z-index: 4;
        top: 50px;
        left: 0px;
        /* Display & Box Model */
        display: flex;
        justify-content: flex-start;
        height: 80px;
        width: 100%;
        box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.05);
        /* Color */
        background-color: white;
        /* Other */
        box-sizing: border-box;
    }

    .md-detail-view-desktop {
        display: none;
    }

    .md-main-subtitle {
        display: block;
        /*margin: 20px;*/
        margin-bottom: 20px;
        margin-top: 20px;
        margin-right: 20px;
        color: var(--text-color);
        font-family: var(--font-family-Light) !important;
        font-size: var(--h4-font-size);
        font-weight: var(--font-weight-300);
    }

    .md-main-title {
        /*display: none;*/
    }

    .shop-icon-burger.icon {
        display: none;
    }

    .shop-icon-burger {
        display: none;
    }

    .shop-detail-main .shop-grid-col-carousel {
        width: calc(33% - 14px);
    }

    .shop-start-header {
        margin-top: 96px;
    }
}



@media (min-width: 1300px) {


    .my-login-carousel {

        max-width: 1470px;
        right: auto;
        margin-left: 470px;

    }

    .shop-grid-col-4 {
        width: calc(25% - 15px);
    }
}

@media (max-width: 1024px) {

    .shop-grid-search-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        ;
    }

    .shop-search-main .shop-search-header {
        margin-top: 14px;
    }

    .md-main,
    .self-service-main,
    .shop-start-content-wrapper,
    .shop-content-main,
    .shop-detail-main,
    .shop-product-detail-rec-carousel-wrapper-boundary>.my-carousel-wrapper {
        padding: 0 20px;
        padding-bottom: 40px;
    }

    .my-home-main-content-wrapper {
        padding: 0 20px;
    }

    .shop-checkout-main {
        padding: 0 20px;
        margin-top: 0px;
    }

    .adm-main,
    .shop-detail-main {
        margin-top: 60px;
    }

    .shop-header-boundary {
        padding: 20px;
    }

    .self-service-main,
    .my-home-main {
        margin-top: 50px;
    }
}

@media (max-width: 861px) {

    .shop-search-main .shop-search-header {
        margin-top: -18px;
    }

    .adm-main {
        margin-top: 30px;
    }

    .my-home-main {
        margin-top: 0px;
    }
}

@media (max-width: 900px) {
    .adm-content-wrapper {
        width: 100%;
    }

    .adm-task-textarea-content {
        min-height: 115px;
    }



    .my-login-info-after .shop-button {
        max-width: 100%;
    }

    .adm-main-carousel-task__panel>c-my-adm-task {
        width: 100%;
    }

    .shop-grid {
        row-gap: 34px;
    }
}

@media (max-width: 670px) {
    .shop-grid-search-main {
        grid-template-columns: repeat(1, 1fr);
    }
}