.community-previous-orders {
    display: none;
}

/* REWE Colors  */

:root {
    /* Blaubeer */
    --blaubeer-1000: #375570;
    --blaubeer-800: #4a7296;
    --blaubeer-600: #5b8cb8;
    --blaubeer-300: #abc2d6;
    --blaubeer-200: #d1dde8;
    --blaubeer-150: #DFE7EE;
    --blaubeer-100: #edf5fc;

    /* Grey */
    --grey-1000: #1c1c1c;
    --grey-800: #676767;
    --grey-500: #949494;
    --grey-300: #cccccc;
    --grey-100: #f1f1f1;

    /* Red */
    --red-1000: #9e0012;
    --red-900: #b50015;
    --red-800: #cc071e;
    --red-300: #e5cacd;
    --red-150: #f5dcdf;
    --red-100: #f9e6e8;

    /* Blue 1000,800,100*/
    --blue-1000: #0047b0;
    --blue-800: #0065cb;
    --blue-100: #e5eff9;

    /* Green 1000,800,100 */
    --green-1000: #005c2e;
    --green-800: #007d3e;
    --green-150: #D9ECE2;
    --green-100: #e6f2ec;

    --main-color-light-transparent: #abc2d642;
    --theme-background-color: var(--blaubeer-100);
    /*Grey 100  */
    --rewe-background: var(--blaubeer-100);

    /*Grey 300  */
    --divider-color: #cccccc;

    /*Grey 1000  */
    --rewe-black: #1c1c1c;

    /*Blaubeer 100  */
    --rewe-main-lightest: #edf5fc;

    /*Blaubeer 200  */
    --secondary-background-color: var(--blaubeer-200);

    /*Blaubeer 300  */
    --rewe-main-lighter: #adc5d9;

    /*Blaubeer 600  */
    --rewe-main-medium: #5b8cb8;

    /*Blaubeer 800*/
    --main-color: #4a7296;

    --link-color: var(--red-900);

    /*Blaubeer 1000*/
    --main-color-dark: #375570;
    --main-color-focus: #375570;

    /*Red 100 */
    --error-bg-color: #f9e6e8;

    /*Red 800  */
    --error-color: #cc071e;

    /*Red 1000  */
    --error-color-dark: #9e0012;

    --main-color-light: #d1dde8;

    /*Green 100  */
    --success-bg-color: #e6f2ec;
    /*Green 800  */
    --success-color: #007d3e;

    --main-font-color: #1c1c1c;
    --secondary-color-light: white;

    --settings-background-color: var(--secondary-background-color);
    --settings-text-color: var(--main-color-dark);

    --header-height: 90px;
    --footer-height: 150px;

    --form-element-height: 50px;

    --link-primary-color: #007bff;
    --link-secondary-color: ;

    --button-border-radius: 8px;

    --text-secondary: var(--grey-800);
}

@media screen and (max-width: 768px) {
    :root {
        --header-height: 60px;
        --footer-height: 450px;
    }
}

#r_main {
    background: var(--rewe-background);
}

.dcc_container {
    display: none;
}

.dcc_main-card {
    background: linear-gradient(to right bottom, var(--main-color-dark), var(--main-color));
}

.footer_container {
    box-shadow: 0 50vh 0 50vh var(--rewe-main-lighter);
    background-color: var(--rewe-main-lighter);
    color: var(--main-color-dark);
}

.link-button.footer-link,
.footer_section_right a {
    color: var(--rewe-black);
    font-weight: bold;

    &:hover:not(:disabled):not(:active) {
        color: var(--red-800);
    }

}



/* BUTTONS */
.icon-button {
    width: 48px;
    height: 48px;
}

/* .icon-button-img {
  width: 30px;
  height: 30px;
} */

.community-field {
    border-radius: 26px;
}

.community-info-left {
    .icon-button {
        outline-offset: -2px;
    }
}

.button {
    padding: 12px 16px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;

}

/* PRIMARY */
.button.primary-button,
.oval-button {
    background-color: var(--red-800);
    color: #ffffff;
    box-sizing: border-box;

    &:hover {
        background-color: var(--red-1000);
    }

    &:focus-visible {
        background-color: var(--red-800);
        border: none;
        outline-offset: 6px;
    }

    &:active {
        background-color: var(--red-900);
        border: none;
        box-shadow: none;
        filter: unset;
    }

    &:disabled {
        background-color: var(--grey-800);
    }

    &:disabled.loading {
        background-color: var(--grey-300);
        border: none;

    }
}

/* GHOST 1 */
.button.secondary-button,
.button.ghost-button {
    background-color: transparent;
    color: var(--blaubeer-1000);
    border: 2px solid var(--blaubeer-1000);
    box-sizing: border-box;
    /* Include border in element's total width and height */

    &:hover {
        background-color: #dfe0e2;
    }

    &:focus-visible {
        background-color: #ffffff;
        border: 2px solid var(--blaubeer-1000);
        outline-offset: 6px;
    }

    &:active {
        background-color: #cfd2d6;
        box-shadow: none;
        filter: unset;
    }

    &:disabled {
        background: transparent;
        color: var(--grey-1000);
        border: 2px solid var(--grey-1000)
    }

    &.loading {
        background-color: transparent;
        border: 2px solid var(--grey-1000);

        .button-loader svg {
            fill: #1c1c1c;
        }
    }
}

/* icon buttons  */
.icon-button:hover:not([disabled]) {
    filter: unset;
}

/* TRASH  */
.icon-button.remove-icon-button {
    border-radius: 50%;
    background: var(--grey-800);

    .icon-button-img {
        filter: invert(100%);
        height: 20px;
        width: 20px;
    }

    &:hover {
        background-color: var(--grey-1000);
    }

    &:focus-visible {
        outline: none;
        background-color: var(--grey-800);
        border: 2px solid var(--grey-1000);
    }

    &:active {
        background-color: var(--grey-300);
        border: none;
    }

    &:disabled {
        background: var(--grey-100);
    }
}

.add-to-wishlist-img {
    filter: invert(100%);
    height: 20px;
    width: 20px;
}

.icon-button.add-to-wishlist-icon,
.icon-button.product-quantity-selector-btn,
.icon-button.primary-icon-button {
    border-radius: 50%;
    background: var(--blaubeer-800);

    &:hover {
        background-color: var(--blaubeer-1000);
    }

    &:focus-visible {
        background-color: var(--blaubeer-800);
        border: 2px solid var(--blaubeer-1000);
    }

    &:active {
        background-color: var(--blaubeer-300);
        border: none;
    }

    &:disabled {
        background: var(--blaubeer-100);
    }
}

.s-edit-icon,
.primary-icon-button {

    /* set the color to white */
    .icon-button-img {
        filter: invert(100%);
        height: 20px;
        width: 20px;
    }
}

.icon-button.product-quantity-selector-btn {
    border-radius: 0;
}

/* IMAGE tool buttons (zoom, rotate) */
.icon-button.image-tool-btn {
    background-color: #ffffff;
    border-radius: 8px;
    width: 48px;
    height: 48px;
    border: 1px solid var(--blaubeer-1000);
    outline-offset: 2px;

    .icon-button-img {
        filter: invert(29%) sepia(35%) saturate(560%) hue-rotate(166deg) brightness(97%) contrast(92%);
    }

    &:hover {
        background-color: var(--blaubeer-100);
        border: 1px solid var(--blaubeer-300);
    }

    &:focus-visible {
        background-color: #ffffff;
        outline: 2px solid #000;
    }

    &:active {
        background-color: var(--blaubeer-200);
        border: 1px solid var(--blaubeer-300);
    }
}

.icon-button.modal-close-button,
.icon-button.drawer-close-btn {
    width: 40px;
    height: 40px;
    background: transparent;
    margin: 4px;

    .icon-button-img {
        filter: invert(29%) sepia(35%) saturate(560%) hue-rotate(166deg) brightness(97%) contrast(92%);
    }

    #entityCloseIcon-icon {
        width: 24px;
        height: 24px;
    }

    &:hover {
        background-color: var(--blaubeer-100);
    }

    &:focus-visible {
        outline: none;
        background-color: transparent;
        border: 2px solid var(--grey-1000);

        .icon-button-img {
            filter: unset;
        }
    }

    &:active {
        background-color: var(--blaubeer-200);
        border: none;

        .icon-button-img {
            filter: invert(29%) sepia(35%) saturate(560%) hue-rotate(166deg) brightness(97%) contrast(92%);
        }
    }
}

.icon-button.wishlist-icon-btn {
    background-color: #ffffff;
    margin: 4px;

    .icon-button-img {
        filter: invert(29%) sepia(35%) saturate(560%) hue-rotate(166deg) brightness(97%) contrast(92%);
        width: 24px;
        height: 24px;
    }

    &:hover {
        background-color: var(--blaubeer-100);
    }

    &:focus-visible {
        background-color: #ffffff;
        outline: none;
        border: 2px solid var(--grey-1000);
    }

    &:active {
        border: none;
        background-color: var(--blaubeer-200);
    }
}

#entityCloseIcon-icon {
    width: 15px;
    height: 15px;
}

.icon-button.carousel__button {
    background-color: #ffffff;
    border: 1px solid var(--blaubeer-1000);
    outline-offset: 2px;

    .icon-button-img {
        filter: invert(29%) sepia(35%) saturate(560%) hue-rotate(166deg) brightness(97%) contrast(92%);
    }

    &:hover {
        background-color: var(--blaubeer-100);
    }

    &:focus-visible {
        background-color: #ffffff;
        outline-offset: 4px;
    }

    &:active {
        background-color: var(--blaubeer-200);
    }
}

.link-button {
    display: inline-block;
    padding: 2px;
    height: 24px;
}

.coupon-preview,
.cart-preview {
    top: 70px;

   /* Very small screens - ensure it fits */
  @media screen and (max-height: 300px) {
    top: 28px;
  }
}

/* header icons */
.header-icon-button {
    background-color: unset;
    outline: none;

    .icon-button-img {
        filter: invert(100%);
    }

    &:hover {
        background-color: unset;

        .icon-button-img {
            filter: invert(100%) sepia(91%) saturate(317%) hue-rotate(146deg) brightness(106%) contrast(86%);
        }
    }

    &:focus-visible {
        outline: none;

        .icon-button-img {
            border: 1px solid #000;
            outline-offset: 2px;
            filter: invert(100%) sepia(91%) saturate(317%) hue-rotate(146deg) brightness(106%) contrast(86%);
            border-radius: 3px;
            padding: 2px;
        }
    }

    &:active {
        .icon-button-img {
            border: none;
        }
    }
}

.s-edit-icon {
    border-radius: 50%;
}


.s-remove-icon img {
    width: 24px;
    height: 24px;
}

.s-order-clear-container.icon-button {
    background-color: #ffffff;
    border: 1px solid var(--blaubeer-1000);
    outline-offset: 2px;

    .icon-button-img {
        filter: invert(29%) sepia(35%) saturate(560%) hue-rotate(166deg) brightness(97%) contrast(92%);
    }

    &:hover {
        background-color: var(--blaubeer-100);
    }

    &:focus-visible {
        background-color: #ffffff;
        outline-offset: 4px;
    }

    &:active {
        background-color: var(--blaubeer-200);
    }
}

/* red icon buttons */
.icon-button.download-icon,
.icon-button.s-order-details-icon,
.icon-button.s-order-settings-icon,
.icon-button.s-order-remove-icon {
    width: 48px;
    height: 48px;
    background-color: var(--red-800);
    border-radius: 8px;
    outline-offset: 2px;
    border: none;

    &:hover {
        background-color: var(--red-1000);
    }

    &:focus-visible {
        background-color: var(--red-800);
        outline: 2px solid #000;
        border: none;
    }

    &:active {
        background-color: var(--red-900);
        border: none;
        outline: none;
    }

    &:disabled {
        background-color: var(--grey-800);
    }
}

/* toggles */
.toggle-switch-checkbox+.toggle-switch-slider {
    background-color: var(--red-800);

    &:hover {
        background-color: var(--red-1000);
    }
}

.toggle-switch-checkbox+.toggle-switch-slider::before {
    background-color: #ffffff;
}

.toggle-switch-checkbox:checked+.toggle-switch-slider {
    background-color: var(--green-800);

    &:hover {
        background-color: var(--green-1000);
    }
}

.toggle-switch-checkbox:checked+.toggle-switch-slider::before {
    background-color: #ffffff;
}

.toggle-switch-checkbox:checked+.pending::before {
    background-color: var(--toggle-pending-color);
}


/* END BUTTONS  */


.small-range-slider .range-slider__thumb {
    border: 2px solid var(--main-color);
}

.cat-filters {
    background-color: var(--main-color-light);
}

.pagination .rc-pagination-item {
    background-color: var(--rewe-main-medium);
    color: var(--rewe-background);
}

.pagination .rc-pagination-item-active {
    color: var(--rewe-background);
    background-color: var(--main-color-dark);
}

.snack-notification.success {
    background-color: var(--success-bg-color);
    /* Green color for success */
    color: var(--success-color);
    border: 1px solid var(--success-color);
    font-weight: bold;
}

.success .snack-close-button {
    color: var(--success-color);
    margin-bottom: -3px;
}

.snack-notification.error {
    background-color: var(--error-bg-color);
    /* Green color for success */
    color: var(--error-color);
    border: 1px solid var(--error-color);
    font-weight: bold;
}

.error .snack-close-button {
    color: var(--error-color);
    margin-bottom: -3px;
}

.product-quantity-selector-btn .icon-button-img {
    filter: invert(100%);
}

#productShortDescription,
#productPrice {
    color: var(--blaubeer-800);
}

#productCode,
.product-section-header {
    color: var(--grey-1000);
}

.product-price {
    background-color: white;
    color: var(--main-font-color);
}

.cart-summary-element,
.cart-summary-element .cart-field-content,
.community-field,
.community-field .field-content {
    background: white;
}

.task.not-completed {
    span {
        color: var(--error-color);
        text-decoration: underline;
        font-weight: bold;
    }
}

.react-tooltip {
    background: var(--rewe-main-lighter);
    color: var(--main-font-color);
}

.product-item {
    background: transparent;
}

.form-element,
.form-element-textarea {
    background-color: white;
}

#modal-header {
    color: var(--main-color);
}

.modal {
    background-color: var(--grey-100);
}

.err-text {
    color: var(--error-color);
}

.community-onboarding-progress circle:not([stroke="lightgrey"]) {
    stroke: var(--success-color);
}

.tab-active-bar {
    background-color: var(--main-color);
}

.settings-nav-item:hover {
    background-color: var(--rewe-main-lighter);
}

.settings-navigation {
    right: 0;
    left: unset;
}

.settings-content-container {
    margin: 40px var(--settings-nav-width) 40px 0;

    @media screen and (max-width: 768px) {
        margin: 0;
    }
}

/*TYPOGRAPHY SECTION  */

.header-1,
.header-2 {
    font-family: font2;
    font-weight: bold;
    font-size: 32px;
    line-height: 43px;
    color: var(--blaubeer-800);
}

.header-3 {
    font-family: font2;
    font-weight: bold;
    font-size: 24px;
    line-height: 32px;
    color: var(--blaubeer-800);
}

.header-4,
.header-5 {
    font-family: font2;
    font-weight: bold;
    font-size: 20px;
    line-height: 26px;
}

.text-1,
.text-2,
.r-tooltip-content {
    font-family: font1;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
}

.text-3 {
    font-family: font1;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
}

.text-4 {
    font-family: font1;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
}

.product-price {
    font-size: 24px;
    line-height: 24px;
}

.community-balance-total {
    border-radius: 22px;
    padding: 10px 15px 16px;
}

.s-search-subtitle {
    margin-top: 6px;
}

.s-order-text {
    color: rgb(52, 52, 52);
}

/*DRAWER SECTION */

.r_drawer_backdrop .r_drawer {
    background-color: white;
    border-radius: 40px 0 0px 40px;
    width: 445px;
    padding: 32px 42px;
}

@media screen and (max-width: 768px) {
    .r_drawer_backdrop .r_drawer {
        border-radius: 0;
        width: 100%;
    }
}

.r_drawer .drawer-logo-container {
    margin-right: 26px;
}

.drawer-actions .button:not(:last-child) {
    margin-bottom: 15px;
}

.r_drawer .drawer-actions {
    width: 295px;
    margin: 50px auto 20px;
}

.drawer-logo-container {
    height: 66px;
}

.r_drawer .divider {
    display: none;
}

.drawer-link-section-title {
    display: none;
}

.drawer-link-section .drawer-link {
    color: var(--main-color);
    padding: 20px;
    padding-top: 0;
    border: 1px solid white;
    border-bottom: 0;
    border-top: 0;
    border-radius: 5px;
    font-size: 20px;
    line-height: 28px;
    font-weight: 400;

    &:hover {
        border-radius: 5px;
        text-decoration: none;
        background-color: var(--secondary-background-color);
        border: 1px solid var(--main-color);
    }

    &:active {
        border-radius: 5px;
        text-decoration: none;
        background-color: var(--main-color);
        color: var(--rewe-main-lightest);
    }

    .fw-bold {
        width: 100%;
        text-align: left;
        padding-top: 20px;
        border-top: 1px solid var(--main-color);
        font-weight: normal;
    }

    &:hover,
    &:active,
    &:focus-within {
        .fw-bold {
            border-top: 0;
        }

        +.drawer-link .fw-bold {
            border-top: 0;
        }
    }

    .fw-bold::after {
        content: ">";
        /* Adds the ">" sign */
        float: right;
        font-family: font1;
        font-weight: 500;
        font-size: 24px;
        line-height: 24px;
    }

    &:last-of-type {
        padding-bottom: 0;

        .fw-bold {
            padding-bottom: 19px;
            border-bottom: 1px solid var(--main-color);
        }
    }

    &:first-of-type {
        .fw-bold {
            border-top: 1px solid white;
        }

        &:hover,
        &:active,
        &:focus-within {
            .fw-bold {
                border-top: 0;
            }
        }
    }

    &:last-of-type:hover .fw-bold {
        border-bottom: 0;
    }
}

@media screen and (min-width: 1480px) {
    .drawer-link {
        padding-bottom: 20px;
    }
}

/* HEADER SECTION */

/*Because max width is 1390px  */
@media screen and (min-width: 1480px) {
    .header-container {
        padding: 12px calc((100% - 1390px) / 2);
    }
}

@media screen and (min-width: 769px) and (max-width: 1479px) {
    .header-container {
        padding: 12px 30px;
    }
}

@media screen and (max-width: 768px) {
    .header-container {
        padding: 10px 15px;
    }
}

.header-container {
    #hamburgerMenuIcon {
        padding: 0;
        width: 35px;
        height: 35px;
        border-radius: 0;
        outline: none;

        .icon-button-img {
            filter: invert(100%);
        }

        &:active,
        &:hover {
            .icon-button-img {
                filter: invert(100%) sepia(91%) saturate(317%) hue-rotate(146deg) brightness(106%) contrast(86%);
            }
        }

        &:focus-visible {

            img {
                border: 1px solid #000;
                padding: 2px;
                border-radius: 3px;
            }
        }


        &:active {
            img {
                border: none;
            }
        }

        img {
            width: 35px;
            height: 35px;
        }
    }
}

.header-icon-one {
    margin: 0 30px;

    @media screen and (max-width: 768px) {
        margin: 0 15px;
    }
}

#header-account-section {
    >div {
        >.header-user-element {
            margin: 0;
        }

        margin: 0 10px;

        @media screen and (max-width: 768px) {
            margin: 0 5px;
        }

        &:first-child {
            margin-left: 0;
        }

        &:last-child {
            margin-right: 0;
        }
    }
}

/*FOOTER SECTION*/

.footer_main-row {
    justify-content: center;
    gap: 15px 417px;
    padding: 15px;

    @media screen and(max-width: 1024px) {
        gap: 15px;
    }

    @media screen and (max-width: 768px) {
        gap: 40px;
    }
}

.footer_section_right {
    padding: 0;

    a {
        margin: 0;
    }
}

.footer_container {
    border-radius: 20px 20px 0 0;
    box-shadow: 0 50vh 0 50vh var(--rewe-background);
}

.footer_navigation {
    gap: 0 15px;

    padding: 0;
    flex-wrap: wrap;
    justify-content: center;

    .footer-link {
        padding: 0;
    }

    @media screen and (max-width: 768px) {
        gap: 10px;
    }
}

.link-button.footer-link {
    font-weight: normal;
    font-family: font1;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
}

.footer_section_right {
    font-family: font1;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
}

/* PAGINATION SECTION */

.pagination .rc-pagination-item {
    background-color: transparent;
    min-width: 12px;
    width: 15px;
    height: unset;

    color: var(--rewe-black);

    a {
        padding: 0;
        margin-top: 0;
    }
}

.pagination .rc-pagination-prev button,
.pagination .rc-pagination-next button {
    background-color: transparent;
}

.pagination .rc-pagination-item-active {
    text-decoration: underline;
    color: var(--main-color-dark);
}

.pagination .rc-pagination-item:active:not([disabled]) {
    transition: unset;
    filter: brightness(0.97);
    box-shadow: unset;
}

.pagination-container {
    background-color: #e9eef3;
    height: 48px;
}

.rc-pagination.pagination {
    font-family: font1;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
}

.cat-checkboxes-container {
    .divider {
        margin-bottom: 12px;
    }

    >div {
        margin-bottom: 8px;
    }
}

.cat-skeleton-filter {
    background-color: unset;
}

.checkbox-input {
    border-color: var(--main-color-dark);

    &::after {
        border-color: transparent;
        border-width: 0 2px 2px 0;
    }

    &:hover {
        background-color: var(--main-rewe-lightest);
    }

    &:active {
        background-color: var(--rewe-main-lighter);
    }

    &:checked {
        background-color: white;

        &::after {
            border-color: var(--main-color-dark);
        }

        &:hover {
            background-color: var(--rewe-lightest);
        }

        &:active {
            background-color: var(--rewe-main-lighter);
        }
    }
}

/* PROGRESS BAR SECTION  */

.line {
    width: 56px;
    height: 2px;

    @media screen and (max-width: 768px) {
        width: 39px;
    }
}

.step-name {
    white-space: unset;
    width: 110px;
    box-sizing: border-box;
    padding: 0 4px;

    @media screen and (max-width: 768px) {
        width: 90px;
    }
}

/* INPUTS SECTION  */

.form-element,
.form-select .form-element {
    border-color: #265d8b;
    padding: 12px;



    &:not(:placeholder-shown):hover,
    &.err-input:hover {
        background-color: var(--main-background);
    }

    &:placeholder-shown:hover,
    &.form-select-no-value:hover {
        background-color: #e9eef3;
    }
}

.form-element:placeholder-shown:hover,
.form-element-textarea:placeholder-shown:hover,
.form-select .form-element:placeholder-shown:hover {
    background-color: #e9eef3;
}

.form-select .form-element {
    padding-right: 4px;
}

.form-select .placeholder-disabled {
    color: var(--divider-color);
}

.form-label-disabled {
    color: #949494;
}

.pagination-container .form-select .form-select-textonly {
    height: 28px;
    background-color: var(--main-color);
    padding: 6px 10px;
    color: white;

    .fs-dropdown-indicator {
        color: white;

        div {
            &:hover {
                color: white;
            }
        }
    }

    .fs-single-value {
        color: white;
    }

    div[data-value] {
        color: white;
    }
}

.fs-dropdown-indicator {
    height: 24px;

    &.multi-value {
        height: unset;
    }
}

.select-value-container {
    height: 24px;

    &.multi-value {
        height: unset;
    }

    >div[data-value] {
        margin: 0;
        padding: 0;
    }
}

.fs-dropdown-indicator-separator {
    margin-top: 0;
    margin-bottom: 0;
}

.form-element-helper {
    &.error-helper {
        border: 1px solid var(--error-color);
        border-radius: 8px;
        padding: 8px 12px;
        background-color: var(--error-bg-color);
    }
}

.form-select-item-notselected,
.form-select-item-selected,
.form-select-item-icon {
    display: none;
}

.form-select-list-item {
    height: 40px;

    &.focused {
        background: #265e8b28;
    }

    &.selected {
        background-color: #265d8b;
        color: white;
    }
}

/* LINK BUTTON SECTION  */

.link-button,
a,
.html-with-link-container a {
    color: var(--error-color);

    &:hover:not(:disabled):not(:active) {
        color: var(--rewe-black);

        span {
            filter: none;
        }
    }

    &:active:not(:disabled) {
        color: var(--error-color-dark);

        span {
            filter: none;
        }
    }

    &.inverted-link:not(:disabled) {
        color: var(--rewe-black);

        &:hover {
            color: var(--error-color);

            span {
                filter: none;
            }
        }

        &:active {
            color: var(--error-color-dark);

            span {
                filter: none;
            }
        }
    }

    &.inverted-white-link:not(:disabled) {
        color: white;

        &:hover {
            color: var(--error-color);

            span {
                filter: none;
            }
        }

        &:active {
            color: var(--error-color-dark);

            span {
                filter: none;
            }
        }
    }

    &:disabled {
        cursor: default;

        span {
            cursor: default;
        }

        opacity: unset;
        color: var(--divider-color);
    }
}

/* Page header (Buhne) section  */
.page-header {
    display: flex;
    color: var(--blaubeer-100);

    .back-button {
        &:hover:not(:disabled):not(:active) {
            color: var(--blaubeer-100);
            text-decoration: underline;
        }

        &:active:not(:disabled) {
            color: var(--blaubeer-100);
        }
    }
}

.tn-header {
    display: none;
    overflow-y: hidden;
}

.product-details {
    margin-top: 24px;
}

#redirect-link-no-pageheader,
.simple_crown-container,
#community-dcc-withlink {
    display: none;
}

.cat-content,
.cart-page,
.product-details {
    margin-top: 48px;
}

.edit-image-modal {
    .header {
        display: none;
    }

    .modal-close-button {
        display: none;
    }
}

.form-select-list-item.hp-dropdown-item {
    height: unset;
}

.product-pack-size-remove.icon-button {
    width: 16px;
    height: 16px;

    #entityCloseIcon-icon {
        width: 11px;
        height: 11px;
    }
}

.product-selected-pack-chip {
    padding: 4px 8px;
    background-color: var(--blaubeer-100);
}

.modal .content-actions {
    max-height: calc(81vh - 138px);
}



.login-forgotpassword {
    margin-bottom: 16px;
    margin-top: -12px;
}

.cp_login-page-container {
    #b_loginButtonText {
        margin-top: 32px;
    }
}

.form-select .form-multiselect-chip {
    background-color: var(--blaubeer-100);
    border: 1px solid var(--blaubeer-1000);
}

.form-select .form-multiselect-label,
.form-select .form-multiselect-remove {
    color: var(--blaubeer-1000);
}

.button.oval-button {
    border-radius: var(--button-border-radius);

    .button-image-container {
        display: none;
    }

    .button-text {
        margin-left: 0;
    }
}

.hp-search-input {
    border-radius: 8px;
}

.snack-notification.info {
    background-color: var(--blaubeer-600);

    .snack-close-button {
        color: white;
    }
}

.confirm-modal-content {
    font-family: font1;
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
}

.link-primary,
.s-voucher-header-link,
.cat-filter .standard-link {
    color: var(--red-800);

    &:hover {
        color: var(--rewe-black);
    }

    &:active {
        color: var(--red-1000);
    }

    &::after {
        content: " >";

    }
}

.cat-filter .standard-link {

    font-size: 18px;
}

.link-secondary-white {
    color: white;
    font-weight: normal;

    &:hover {
        color: var(--red-800);

    }

    &:focus-within: {
        outline-color: white;
    }

    &:active {
        color: var(--red-1000);
    }

    &::after {
        content: " >";
        /* Adds the ">" sign */


    }
}

.community-name {
    color: var(--blaubeer-800);
}

#redirect-link-in-pageheader {
    padding: 8px;

    a {
        font-size: 18.7px;
        line-height: 28px;
        color: white;

        &:hover {
            /*  color: #f3f3f3; */
            color: var(--blaubeer-100);
        }

        &:focus-visible {
            outline: 1px solid var(--blaubeer-100);
            outline-offset: 6px;

        }

        &:active {
            /*    color: #e3e3e3; */
            color: var(--blaubeer-200);
        }

        &::after {
            content: " >";
            /* Adds the ">" sign */
        }
    }
}

.cat-noresult-text {
    font-family: font1;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
}

.s-sub-bottom-content {
    max-width: 400px;
    width: 100%;
    text-align: left;
}

.s-sub-bottom-text {
    a {
        font-family: font1;
    }
}

#imageTermsAndConditionsHtml {
    font-size: 14px;
    max-width: 400px;
}

.community-banner>.banner-img,
.community-logo>.logo-img {
    background: white;
}

.modal .header {
    padding-right: 48px;

    @media screen and (max-width: 768px) {
        padding-right: 48px;
    }
}

@media only screen and (max-width: 500px) {

    #termsAndConditionsHeader1,
    #PrivacyPolicyHeader1 {
        font-size: 26px !important;
    }

    #termsAndConditionsHeader2,
    #PrivacyPolicyHeader2 {
        font-size: 22.5px !important;
    }

    #termsAndConditionsHeader3,
    #PrivacyPolicyHeader3 {
        font-size: 24px !important;
    }
}

.community-marketing-banner img {
    object-fit: cover;
}

.settings-nav-header,
.st-content-title,
.settings-nav-segment-header,
.s-voucher-points {
    color: var(--blaubeer-800);
}

.divider {
    border-bottom: 1px solid var(--blaubeer-800);
}

.settings-nav-item {
    color: var(--grey-1000);
}

.s-voucher-available-progress {
    background: #53936c;
}

.s-voucher-spent-progress {
    background: #F08159;
}

.s-voucher-total-progress {
    background: var(--grey-500);
}

.pd-section-container {
    background-color: white;
}

.community-description-modal>div {
    padding: 1px;
}

.newsletter-background {
    background-color: var(--rewe-background);

}

#newsletterLandingText {
    color: var(--grey-1000);
}

#contactFaqIcon,
#contactPhoneIcon,
#contactMessageIcon,
#contactChatIcon {
    height: 35px;
    width: 35px;
}

div:has(> #contactPhoneIcon) {
    height: 36px;
}

#cat-filter-wrapper>div.mb-24.header-4.text-dark {
    color: #d1dde8;
}

.edit-logo-button {
    left: 180px;
}

.edit-banner-button {
    right: 22px !important;
    bottom: -25px !important;
}

@media screen and (max-width: 768px) {

    .community-logo .edit-logo-button {
        left: 90px;
        bottom: -3px;
    }
}

.s-order-remove-icon {
    margin: auto 0;
}

.filter-overlay-clear-button {
    .icon-button-img {
        filter: invert(29%) sepia(35%) saturate(560%) hue-rotate(166deg) brightness(97%) contrast(92%);
    }

}

.pagination-container {
    background-color: unset;
}

.settings-nav-content {
    .txt-underline {
        text-decoration: unset;
    }
}

.community-info-balance>div.community-balance-total {
    color: white;
}


#wishlistEmptyIcon {
    filter: invert(29%) sepia(35%) saturate(560%) hue-rotate(166deg) brightness(97%) contrast(92%);
}

.product-item>.product-item-title,
.product-card>.product-card-info>div.header-4,
.order-product-card>.order-product-card-info>div.header-4 {
    color: var(--blaubeer-800);
}

#productSizePackSubtitle,
.product-pack-size-chip {
    color: var(--grey-800);
}

.cat-select-pagination>div>div.form-element.form-select-textonly:hover {
    background-color: var(--blaubeer-1000) !important;
}

.cat-select-pagination>div>div>div.fs-dropdown-indicator>.fs-dropdown-indicator-separator {
    background-color: white;
}

.cat-select-pagination>div>div>div.fs-dropdown-indicator>div>svg {
    color: white;
}

.s-order-value {
    color: var(--settings-text-color);
}

.order-details-page>.s-card-container>.order-items>.order-product-card {
    background: white;
}

.contact-container>div>div.s-component-container>section>div.s-search-value>div.text-2 {
    font-size: 14px;
    line-height: 20px;
}

.cart-address-selected-text {
    line-height: 30px !important;
}

/* Hide unused footer link 5  */
#b_footerLink5 {
    display: none;
}

.s-mobile-nav-button>#settingsIcon-icon {
    filter: invert(1);
}

.product-error-message {
    padding: 28px;
    font-family: font1;
    font-size: 16px;
    color: white;
    background-color: unset;
    font-weight: 500;
    line-height: unset;
    background-image: url("https://stgrewedecms.blob.core.windows.net/cms/backgrounds/24d6475a-f906-4e10-8601-385c53bd0ff3.png");
    background-size: 100% 100%;

}


.r_main_container:has(.dsp-flex):has(div.settings-navigation)+#footer_container {
    border-top-right-radius: 0px;

    @media screen and (max-width: 768px) {
        border-radius: 20px 20px 0 0;
        box-shadow: 0 50vh 0 50vh var(--settings-background-color);
    }
}

.drawer-link-section>.drawer-link {
    font-family: font3;
}

.r_drawer.open {
    padding-top: 26px;
}