:root {
    /* ######################################### */
    /* ############ Color Variables ############ */
    /* ################################ */

    /* Primary Colors */
    --rig-primary-color: #005EB8;
    --rig-primary-color-hover: #00498F;
    --rig-secondary-color: #00D2D2;
    --rig-tertiery-color: #00B3B3;
    --rig-text-dark-gray: #454545;

    /* Secondary Colors */
    --rig-red: #FF3B30;
    --rig-dark-red: #dc3427;
    --rig-brown-gray-color: #625C59;
    --rig-gray-color: #AAAAAA;
    --rig-middle-gray-color: #ECEBEA;
    --rig-light-gray-color: #CCCCCC;
    --rig-address-box-gray: #c9c9c9;
    --rig-lighter-gray-color: #F5F5F5;
    --rig-light-blue: #F1F9FF;
    --rig-lighter-blue: #F7F9FA;
    --rig-gray-box: #F8F8F8;

    /* Button Variables */
    --sds-c-button-brand-color-background-hover: transparent;
    --slds-c-button-brand-text-color-hover: var(--rig-primary-color);
    --sds-c-button-outline-brand-color-background-hover: var(--rig-primary-color);
    --slds-c-button-sizing-border: 0.125rem;
    --sds-c-button-brand-text-color-hover: var(--rig-primary-color);
    --sds-c-button-text-color-hover: var(--rig-primary-color);
    --sds-c-button-shadow-focus: none;
    --slds-c-button-color-border-active: transparent;
    --dxp-s-button-font-weight: 400;

    /* Checkbox Variables */
    --dxp-s-form-checkbox-radius-border: 0.125rem;
    --slds-c-checkbox-radius-border: .125rem;
    --slds-c-checkbox-shadow-focus: none;

    /* Radio Button Variables */
    --dxp-s-form-element-color-border-focus: none;
    --sds-c-radio-mark-color-foreground: var(--rig-secondary-color);
    --sds-c-radio-color-border-focus: var(--rig-gray-color);
    --slds-c-radio-shadow-focus: none;

    /* Input Fields & Comboboxes Variables */
    --dxp-s-form-element-radius-border: 3.125rem;

    /* Header Variables */
    --dxp-c-header-container-spacing-block-start: 0;
    --dxp-c-header-container-spacing-block-end: 0.25rem;
    --dxp-c-l-picker-button-alignment: unset;

    /* Return Variables */
    textarea {
        --dxp-s-form-element-radius-border: 0.4rem;
    }

    .grecaptcha-badge { visibility: hidden; }

    /* General letter-spacing */
    --dxp-s-body-letter-spacing: 0.038rem;
    --dxp-s-body-small-letter-spacing: 0.038rem;
    --dxp-s-button-letter-spacing: 0.038rem;
    --dxp-c-title-caps-letter-spacing: 0.038rem;
    --dxp-s-text-heading-medium-letter-spacing: 0.038rem;
    --dxp-s-text-heading-small-letter-spacing: 0.038rem;
    --dxp-s-text-heading-extra-large-letter-spacing: 0.038rem;
    --dxp-s-text-heading-large-letter-spacing: 0.038rem;

    lightning-base-combobox-item {
        font-family: var(--dxp-s-body-font-family) !important;
    }

    button {
        letter-spacing: 0.038rem;
        font-weight: 400;
    }

    input {
        letter-spacing: 0.038rem;
    }

    h1, h2, h3, h4, h5 {
        letter-spacing: 0.05rem;
        font-family: "RIG Ubuntu", sans-serif;
    }

    /* Wishlist Variables */
    .card-item {
        button {
            --slds-c-button-spacing-inline-end: .25rem;
            --slds-c-button-spacing-inline-start: .25rem;
            --dxp-s-button-font-size: .875rem;
            font-size: .875rem;
        }

        button:last-child {
            text-decoration: none;
            --com-c-wishlist-remove-button-text-decoration: none;

            &:hover {
                text-decoration: underline;
                text-decoration-color: var(--rig-primary-color-hover);
                color: var(--rig-primary-color-hover);
                --com-c-wishlist-remove-button-text-decoration: none;
            }
        }
    }

    /* ################################ */
    /* ###### Header Styles ########### */
    /* ################################ */

    .rig-promo-banner-col {
        .columns {
            flex-direction: row-reverse !important;
        }
    }

    c-rig-commerce-header {
        background-color: white;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;

        @media only screen and (max-width: 768px) {
            img {
                width: 7rem;
                max-height: 7rem;
            }
        }
    }

    commerce-country-picker-button {
        button {
            margin-inline-end: 1rem;
            height: 38px;
        }

        button:hover {
            color: white !important;
            --slds-c-icon-color-foreground: white !important;
        }
    }

    .commerce-breadcrumb {
        display: flex;
        justify-content: flex-start;
        margin-left: 3.75rem;
    }

    @media (max-width: 768px) {
        .commerce-breadcrumb {
            margin-left: 1.375rem;
            margin-bottom: 1.5rem;
        }

        commerce_product_details-heading h1 {
            margin-bottom: -0.5rem;
        }
    }

    commerce_builder-product-fields-table {
        margin-top: 1rem;
    }

    commerce_builder-product-fields-table tr.slds-border_bottom {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }

    .breadcrumb-list {
        --com-c-breadcrumb-font-family: "RIG Roboto", sans-serif;
        --dxp-s-text-heading-small-font-family: "RIG Roboto", sans-serif;
        --dxp-g-heading-font-family: "RIG Roboto", sans-serif;
        --com-c-breadcrumb-text-color: #1D1E20;
        --com-c-breadcrumb-link-color: #1D1E20;
        --com-c-breadcrumb-link-hover-color: var(--rig-text-dark-gray);
        --com-c-breadcrumb-divider: '';
        --com-c-breadcrumb-divider-color: #1D1E20;
        --slds-c-breadcrumbs-spacing-inline-start: 0.5rem;
        --slds-c-breadcrumbs-spacing-inline-end: 0.5rem;
        font-size: 1rem;

        li {
            display: flex;
            align-items: center;
            padding-left: 0 !important;
        }

        a:link {
            text-decoration: none;
        }

        p {
            margin-right: var(--slds-c-breadcrumbs-spacing-inline-start);
        }

        p:before {
            display: block;
            width: 0.875rem;
            height: 0.875rem;
            background: url("./icons/breadcrumb-divider.svg") no-repeat 0.05rem;
            background-size: 0.7rem !important;
        }

    }

    .slds-button {
        transition: border 0.15s linear,
                    background-color 0.15s linear,
                    color 0.15s linear;
    }

    .slds-button_outline-brand:focus,
    .slds-button_outline-brand:hover {
        background-color: var(--rig-primary-color);
        color: white;
    }

    .rig-button-tertiery {
        a {
            color: white;
            background-color: var(--rig-secondary-color);
            padding-inline: 2.5rem;
        }

        a:hover {
            background-color: var(--rig-tertiery-color);
        }
    }

    /* ################################ */
    /* ###### Button Styles ########### */
    /* ################################ */

    [kx-scope=button-brand]:hover:before {
        background: none;
    }

    [kx-scope=button-brand]:active,
    [kx-scope=button-filled]:active,
    [kx-scope=button-neutral]:active,
    [kx-scope=button-outline]:active {
        transform: scale(1);
    }

    button[kx-scope="button-neutral"] {
        border-color: var(--rig-primary-color);

        &:hover {
            background-color: var(--rig-primary-color);
            color: white;
        }
    }

    .slds-global-actions__item-action:focus,
    .slds-global-actions__item-action:hover:not(:disabled) {
        outline: none;
        color: transparent;
    }

    .slds-global-actions__item-action:active {
        animation: none;
        -webkit-animation: none;
    }

    /* ################################ */
    /* ###### Search Bar Styles ####### */
    /* ################################ */

    .rig-search-bar,
    .rig-search-bar_round-icon {
        .input-search-button {
            border-top-left-radius: 3.125rem!important;
            border-bottom-left-radius: 3.125rem!important;
            border-bottom-right-radius: 3.125rem!important;
            border-top-right-radius: 3.125rem!important;
            height: 100%;
            border: none;
        }

        .input-container {
            margin-top: -0.5rem;
            height: 3.438rem;
        }

        .search-input-with-button{
            line-height: 19px;
        }

        .input-wrapper {
            margin-right: -3.125rem;
            padding: 0.125rem;
            border: 1px solid var(--rig-lighter-gray-color);
            border-radius: 3.125rem !important; /* Necessary to override Salesforce inline styles */
            box-shadow: 0 3px 5px rgb(237, 237, 237);
            transition: border 0.15s linear,
            box-shadow 0.15s linear;
            flex-grow: 0;

            &.active {
                border: 1.5px solid var(--rig-secondary-color) !important; /* Necessary to override Salesforce inline styles */
                box-shadow: 0 3px 5px rgb(237, 237, 237);
            }
        }
    }

    commerce_search-list-box ul {
        margin-top: 0.125rem;
        width: 100%;
        border-radius: 0.25rem !important;
        border: 1px solid var(--dxp-s-dropdown-color-border) !important;
        box-shadow: 0 3px 5px rgb(237, 237, 237);


        li {
            border-bottom-style: none;
            padding-block: 0.5rem;
            padding-inline: 1rem;
            display: flex;
            flex-direction: row;
            align-items: center;
        }

        .option-inline-container{
            padding-inline: 0;
        }

    }

    .rig-search-bar_round-icon {
        .input-search-button {
            position: relative;
            top: 0.313rem;
            padding: 0;
            height: 2.813rem;
            aspect-ratio: 1;
        }

        .input-wrapper {
            padding: 0.125rem 0.125rem 0.125rem 1rem;
        }
    }

    /* ################################ */
    /* ###### Navigation Styles ####### */
    /* ################################ */

    @media only screen and (max-width: 899px) {
        .header-content > div:first-child {
            flex-wrap: wrap;
        }
    }

    @media only screen and (min-width: 900px) {
        .header-content > div:first-child {
            flex-wrap: nowrap;
        }
    }

    .slds-p-horizontal--xx-large,
    .slds-p-horizontal_xx-large {
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: space-between;
    }

    .header-badge-icons {
        gap: 0.875rem;
    }

    @media only screen and (max-width: 767px) {
        .header-badge-icons {
            top: -1.125rem !important;
            height: auto !important;

            .slds-grid {
                flex-wrap: wrap;
            }

            .header-account {
                padding-right: 0 !important;
            }
        }
    }

    .menu-button {
        color: var(--rig-brown-gray-color)!important; /* Necessary to override Salesforce inline styles */
    }

    .rig-user-menu {
        cursor: pointer;
        display: flex;
        justify-content: flex-end;

        .menu-trigger-p {
            overflow-wrap: unset;
        }

        .slds-dropdown__list a.menu-item,
        .slds-dropdown__list a.menu-item_hover {
            --dxp-g-root-contrast: var(--rig-brown-gray-color) !important;
            transition: background-color 0.2s linear;
            border: none !important;
            height: 2.813rem;
            padding: 0.75rem 1.5rem;
            font-size: 0.875rem;
        }

        .slds-dropdown__list a.menu-item-bg-hover-color {
            --dxp-g-root-1: var(--rig-middle-gray-color) !important;
            color: black !important;
            box-shadow: none;
        }

        .menu_ul {
            box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.16);
            animation-name: slideDownUserMenu;
            animation-duration: 0.2s;
            animation-iteration-count: 1;

            li a span {
                letter-spacing: 0.05em;
            }
        }

        @keyframes slideDownUserMenu {
            0% {
                transform: scaleY(0);
                transform-origin: 0 0;
            }

            100% {
                transform: scaleY(1);
                transform-origin: 0 0;
            }
        }

        .slds-dropdown {
            padding: 0;
            border-radius: 0;

            @media only screen and (max-width: 768px) {
                --dxp-s-dropdown-color-border: var(--rig-middle-gray-color);
            }
        }

        .dropdown-ctn {
            inset-inline-start: unset;
            width: 50vw;
        }

        .slds-nubbin_top-right {
            border-color: var(--rig-middle-gray-color);
        }

        .menu-trigger-p {
            font-family: "RIG Roboto", sans-serif;
            font-weight: 400;
            font-size: 1rem;
        }
    }

    .rig-user-menu,
    .icon-color {
        --sds-c-icon-color-foreground-default: var(--rig-primary-color)!important; /* Necessary to override Salesforce inline styles */
    }

    .rig-user-menu:focus {
        outline: none;
    }

    .rig-nav-pages {
        line-height:19px;
        ul {
            gap: 3.125rem;
            --dxp-c-navigation-list-nested-outline: 1px solid var(--rig-middle-gray-color);
        }

        ul > li > a {
            color: #1D1E20;
        }

        ul > li > button {
            color: #1D1E20;
        }

        button.slds-p-horizontal_large {
            padding-right: 2rem !important; /* Necessary to override Salesforce inline styles */
        }
    }

    .rig-country-chooser {
        text-decoration: none;

        .commerce-country-picker-icon-color {
            --slds-c-icon-color-foreground: unset;

            &:hover {
                --slds-c-icon-color-foreground: unset;
            }
        }

        .slds-button {
            color: var(--rig-text-dark-gray) !important;
            text-decoration: none !important;
        }

        .slds-button:hover {
            color: var(--rig-light-gray-color);
            text-decoration: underline !important;
        }

        lightning-icon {
            margin-bottom: 2px;
        }
    }

    .promo-banner {
        a, a:link:not(.slds-button,.slds-dropdown__item > a) {
            text-decoration: none;
        }

        display: flex;
        flex-direction: row-reverse;
        justify-content: flex-start;
        background-color: var(--rig-lighter-gray-color)!important; /* Necessary to override Salesforce default styles */

        .component-wrapper-spacer {
            margin-bottom: 0;
        }

    }
}

/* ################################ */
/* ###### Fonts ################### */
/* ################################ */

@font-face {
    font-family: "RIG Roboto";
    font-weight: 700;
    src: url("./fonts/Roboto-Bold.ttf") format("truetype");
    font-display: block;
}

@font-face {
    font-family: "RIG Roboto";
    font-weight: 400;
    src: url("./fonts/Roboto-Regular.ttf") format("truetype");
    font-display: block;
}

@font-face {
    font-family: "RIG Roboto";
    font-weight: 300;
    src: url("./fonts/Roboto-Light.ttf") format("truetype");
    font-display: block;
}

@font-face {
    font-family: "RIG Ubuntu";
    font-weight: 700;
    src: url("./fonts/Ubuntu-Bold.ttf") format("truetype");
    font-display: block;
}

@font-face {
    font-family: "RIG Ubuntu";
    font-weight: 500;
    src: url("./fonts/Ubuntu-Medium.ttf") format("truetype");
    font-display: block;
}

@font-face {
    font-family: "RIG Ubuntu";
    font-weight: 400;
    src: url("./fonts/Roboto-Regular.ttf") format("truetype");
    font-display: block;
}

@font-face {
    font-family: "RIG Ubuntu";
    font-weight: 300;
    src: url("./fonts/Roboto-Light.ttf") format("truetype");
    font-display: block;
}

/* Set the font family for the entire application.To prevent Salesforce sans serif as default */
input, textarea, select,lightning-base-combobox button,fieldset label > span,label {
    font-family: "RIG Roboto", sans-serif !important;
}

/* ################################ */
/* ###### Main Colors Styles ###### */
/* ################################ */

.rig-color-section,
.rig-color-section--secondary,
.rig-color-section--tertiery,
.rig-color-section--text-main,
.rig-color-section--brown-gray-color,
.rig-color-section--gray-color,
.rig-color-section--light-gray-color,
.rig-color-section--lighter-gray-color {
    height: 3rem;
    width: 3rem;
    border-radius: 50%;
    background-color: var(--rig-primary-color);
}

.rig-color-section--secondary {
    background-color: var(--rig-secondary-color);
}

.rig-color-section--tertiery {
    background-color: var(--rig-tertiery-color);
}

.rig-color-section--text-main {
    background-color: var(--rig-text-dark-gray);
}

.rig-color-section--brown-gray-color {
    background-color: var(--rig-brown-gray-color);
}

.rig-color-section--gray-color {
    background-color: var(--rig-gray-color);
}

.rig-color-section--light-gray-color {
    background-color: var(--rig-light-gray-color);
}

.rig-color-section--lighter-gray-color {
    background-color: var(--rig-lighter-gray-color);
}

/* ################################ */
/* ###### Menü Styles ############# */
/* ################################ */

.rig-menu,
.rig-menu--light,
.rig-menu--small,
.rig-menu--text-secondary,
.rig-menu--text-light {
    font-family: "RIG Ubuntu", sans-serif;
    font-weight: bold;
    text-align: center;
    color: var(--rig-brown-gray-color);
    padding: 0.5rem 1.875rem;
    border-radius: 3.125rem;
    width: fit-content;
    height: auto;
    background-color: var(--rig-light-gray-color);
    cursor: default;
}

.rig-menu--light {
    background-color: var(--rig-lighter-gray-color);
}

.rig-menu--small {
    line-height: 1.4rem;
    padding: 0 1rem;
    width: fit-content;
    height: 1.563rem;
}

.rig-menu--text-secondary {
    background-color: transparent;
    color: var(--rig-secondary-color);
    border: 0.063rem solid var(--rig-secondary-color);
}

.rig-menu--text-light {
    background-color: transparent;
    color: var(--rig-gray-color);
    border: 0.063rem solid var(--rig-gray-color);
}

/* ################################ */
/* ###### Tags / Filter Styles #### */
/* ################################ */

.rig-tags {
    font-family: "RIG Ubuntu", sans-serif;
    color: var(--rig-brown-gray-color);
    background-color: var(--rig-lighter-gray-color);
    border-radius: 3.125rem;
    padding: 0.063rem 0.625rem;
    width: fit-content;
    height: auto;
    cursor: default;
}

.rig-tag__icon {
    padding-left: 0.188rem;
}

.rig-filter-button,
.rig-label-new,
.rig-label-sale {
    display: flex;
    align-items: center;
    border: none;
    background-color: var(--rig-primary-color);
    color: white;
    width: fit-content;
    border-radius: 3.125rem;
    padding: 0.313rem 0.938rem;
    gap: 0.313rem;

    &:hover {
        background-color: var(--rig-primary-color-hover);
        cursor: pointer;
    }

    .slds-button__icon {
        fill: white;
        width: 0.875rem;
        height: 1.375rem;

        &:hover {
            fill: white;
        }
    }

    .slds-button--icon-border,
    .slds-button--icon-border-filled,
    .slds-button_icon-border,
    .slds-button_icon-border-filled {
        border: none;
    }
}

/* ################################ */
/* ###### Label Styles ####### */
/* ################################ */

.rig-label-sale {
    font-size: 0.75rem;
    background-color: white;
    color: var(--rig-red);
    border: 1px solid var(--rig-red);
    padding: 0.1rem 0.7rem;

    &:hover {
        background-color: transparent;
        color: var(--rig-red);
        border: 1px solid var(--rig-red);
    }
}

.rig-label-new {
    font-size: 0.75rem;
    background-color: var(--rig-red);
    font-weight: 700;
    padding: 0.1rem 0.7rem;

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

.rig-label-position {
    top: 10px;
    left: 5px;
}

/* ################################ */
/* ###### Info Boxes Styles ####### */
/* ################################ */

.slds-box {
    border: none;
    background-color: var(--rig-gray-box);
    padding: 2.5rem 2.5rem 2.5rem 4.5rem;
}

.slds-box > ul {
    list-style: disc;
}

/* ################################## */
/* ###### Navigationspfeile Styles ## */
/* ################################## */

.rig-icon-button,
.rig-icon-button--small,
.rig-icon-button--secondary {
    padding: 0.5rem;
    background-color: var(--rig-secondary-color);
    width: auto;
    transform: skew(10deg, -15deg);
    border-radius: 0.25rem;


    .slds-icon-text-default,
    .slds-icon,
    .slds-icon-text-default {
        fill: white;
        transform: skew(-10deg, 15deg);
    }
}

.rig-icon-button--secondary {
    background-color: var(--rig-light-gray-color);
}

.rig-icon-button--small {
    padding: 0.1rem;
    background-color: transparent;
    border: 0.063rem solid var(--rig-secondary-color);

    .slds-icon-text-default,
    .slds-icon,
    .slds-icon-text-default {
        fill: var(--rig-secondary-color);
    }
}

.rig-icon-button--plain {
    .slds-icon-text-default,
    .slds-icon,
    .slds-icon-text-default {
        fill: var(--rig-primary-color);
    }
}

.rig-circle-nav {
    display: flex;
    gap: 0.5rem;
}

.rig-circle-nav__circle,
.rig-circle-nav__circle--active {
    width: 0.5rem;
    height: 0.5rem;
    background-color: var(--rig-gray-color);
    border-radius: 50%;
    transition: background-color 0.3s;

    &:hover {
        background-color: var(--rig-brown-gray-color);

    }
}

.rig-circle-nav__circle--active {
    background-color: var(--rig-secondary-color);
}

/* ################################ */
/* ############ Inputs ############ */
/* ################################ */

.slds-input,
.slds-combobox__input {
    border: 1px solid var(--rig-gray-color);

    ::placeholder {
        color: var(--rig-light-gray-color);
        opacity: 1;
    }

    &:focus,
    &:active {
        border: 1px solid var(--rig-secondary-color) !important; /* Necessary to override Salesforce inline styles */
        box-shadow: 0 0 2px var(--rig-secondary-color) !important; /* Necessary to override Salesforce inline styles */
    }
}

/* #################################### */
/* ############ Datepicker ############ */
/* #################################### */

.slds-datepicker {
    .slds-select_container {
        .slds-select {
            border-radius: .25rem !important;
        }
    }

    .slds-button {
        &[name="today"] {
            padding: 0 .25rem;
            margin-bottom: .75rem;
        }

        &:active,
        &:focus {
            box-shadow: none;
            border-radius: .25rem;
        }
    }
}

/* ################################ */
/* ########### Checkbox Styles #### */
/* ################################ */

.slds-checkbox .slds-checkbox--faux,
.slds-checkbox .slds-checkbox_faux {
    width: 16px; /* needs to be px, to center the :after content */
    height: 16px; /* needs to be px, to center the :after content */
}

.slds-checkbox [type=checkbox]:checked+.slds-checkbox--faux:after,
.slds-checkbox [type=checkbox]:checked+.slds-checkbox__label .slds-checkbox--faux:after,
.slds-checkbox [type=checkbox]:checked+.slds-checkbox__label .slds-checkbox_faux:after,
.slds-checkbox [type=checkbox]:checked+.slds-checkbox_faux:after,
.slds-checkbox [type=checkbox]:checked~.slds-checkbox--faux:after,
.slds-checkbox [type=checkbox]:checked~.slds-checkbox_faux:after {
    width: 10px; /* needs to be px, to center the :after content */
    height: 10px; /* needs to be px, to center the :after content */
    border-bottom: none;
    border-left: none;
    background-color: var(--rig-secondary-color);
    border-radius: 0.063rem;
    transform: translate(-50%, -50%);
}

/* ################################ */
/* ###### Radio Buttons Styles #### */
/* ################################ */

.slds-radio .slds-radio--faux,
.slds-radio .slds-radio_faux {
    width: 16px; /* needs to be px, to center the :after content */
    height: 16px; /* needs to be px, to center the :after content */
}


.slds-radio [type=radio]:checked+.slds-radio--faux:after,
.slds-radio [type=radio]:checked+.slds-radio__label .slds-radio--faux:after,
.slds-radio [type=radio]:checked+.slds-radio__label .slds-radio_faux:after,
.slds-radio [type=radio]:checked+.slds-radio_faux:after,
.slds-radio [type=radio]:checked~.slds-radio--faux:after,
.slds-radio [type=radio]:checked~.slds-radio_faux:after {
    width: 10px; /* needs to be px, to center the :after content */
    height: 10px; /* needs to be px, to center the :after content */
}

/* ###################################################### */
/* ########### Inputs, Dropdowns & Comboboxes Styles #### */
/* ###################################################### */

.slds-combobox__input {
    border: 1px solid var(--rig-gray-color);

    &:focus,
    &:active {
        border-color: var(--rig-secondary-color);
        box-shadow: none;
        -webkit-box-shadow: none;
    }
}

.slds-listbox--vertical .slds-listbox__option--plain,
.slds-listbox--vertical .slds-listbox__option_plain,
.slds-listbox_vertical .slds-listbox__option--plain,
.slds-listbox_vertical .slds-listbox__option_plain {
    margin: 0 .125rem;
}

.slds-listbox--vertical .slds-listbox__option.slds-has-focus,
.slds-listbox--vertical .slds-listbox__option:focus,
.slds-listbox--vertical .slds-listbox__option:hover,
.slds-listbox_vertical .slds-listbox__option.slds-has-focus,
.slds-listbox_vertical .slds-listbox__option:focus,
.slds-listbox_vertical .slds-listbox__option:hover {
    margin: 0 .125rem;
    background-color: var(--rig-gray-box, var(--rig-gray-box));
    -webkit-box-shadow: 0 0 0 1px var(--rig-secondary-color) inset;
    box-shadow: 0 0 0 1px var(--rig-secondary-color) inset;
}

.slds-input:active,
.slds-input:focus,
.slds-combobox__input:active,
.slds-combobox__input:focus {
    border: 1px solid var(--rig-secondary-color) !important; /* Necessary to override Salesforce inline styles */
    box-shadow: 0 0 2px var(--rig-secondary-color) !important; /* Necessary to override Salesforce inline styles */
}

/* Dropdown remove box-shadow */
.slds-listbox--vertical .slds-listbox__option.slds-has-focus,
.slds-listbox--vertical .slds-listbox__option:focus,
.slds-listbox--vertical .slds-listbox__option:hover,
.slds-listbox_vertical .slds-listbox__option.slds-has-focus,
.slds-listbox_vertical .slds-listbox__option:focus,
.slds-listbox_vertical .slds-listbox__option:hover {
    box-shadow: none;
}

/* ####################### */
/* ###### Return Styles ## */
/* ####################### */

.c-return__container{
    label, input {
        font-family: "RIG Roboto", sans-serif;
    }
    .slds-form-element__label {
        font-family: "RIG Ubuntu", sans-serif;
    }

    .slds-textarea:focus, .slds-textarea:active {
        border: 1px solid var(--rig-secondary-color) !important;
        box-shadow: 0 0 2px var(--rig-secondary-color) !important;
    }
}

.radio_group-container {
    display: flex;
    flex-direction: column;
    .radio_group-label {
        font-weight: 400;
        color: #7E7E7E;
        padding-right: .5rem;
        margin-bottom: .125rem;
    }

    .radio-option {
        display: flex;
        flex-direction: row;
        gap: 1rem;
    }
}

/* ################################################# */
/* ###### Checkout - Shipping Instructions Styles ## */
/* ################################################# */

.rig-shipping-instructions {
    [part="input-container"] {
        .slds-input {
            padding: 0.5rem 0 0.5rem 0.75rem;

            border: 1px solid var(--rig-lighter-gray-color);

            border-radius: 3.125rem !important; /* Necessary to override Salesforce inline styles */
            box-shadow: 0 3px 5px rgb(237, 237, 237);
            transition: border 0.15s linear,
            box-shadow 0.15s linear;

            ::placeholder {
                color: var(--rig-gray-color);
                opacity: 1;
            }

            &:focus,
            &:active {
                border: 1px solid var(--rig-secondary-color) !important; /* Necessary to override Salesforce inline styles */
                box-shadow: 0 0 2px var(--rig-secondary-color);
            }
        }
    }
}

/* ################################################# */
/* ###### Checkout - Shipping Adresses Styles ## */
/* ################################################# */
c-rig-b2b-shipping-address {
    .card-container .card-size.card-padding {
        font-style: normal;
    }
    .heading {
        font-family: "RIG Roboto", sans-serif;
        font-size: 16px;
        font-weight: 700;
        color: black;
        padding-bottom: 0 !important;
        line-height: 24px;
    }

    .slds-visual-picker {
        min-width: 0;
    }

    @media (max-width: 768px) {
        .grid-container {
            grid-template-columns: 1fr !important;
        }
    }

    lightning-input-address {

        lightning-picklist[data-field="country"] {
            margin: 0;
            padding-inline: 0 !important;

            input{
                padding-left: 12px !important;
            }
        }

        lightning-input[data-field="city"] {
            width: -webkit-fill-available;
        }

        lightning-picklist[data-field="province"],lightning-input[data-field="province"] {
            display:none;
        }
    }
}

/* ######################################## */
/* ###### My Acount - My Profile ######### */
/* ######################################## */
.my-profile{
    form > div.slds-grid {
        flex-direction: column !important;
        gap: 1rem;
    }

    b[slot="title"]{
        text-wrap: wrap;
    }

    button[aria-labelledby="phone-number-label prefix"]{
        box-shadow:none;
        border-color: var(--rig-gray-color);
    }
}

.rig-account-nav {
    .slds-select {
        /* background-color:#d8c5c5; */
        border-color: var(--rig-gray-color);
    }

    .slds-select:focus, .slds-select:active {
        border: 1px solid var(--rig-secondary-color) !important;
        box-shadow: 0 0 2px var(--rig-secondary-color) !important;
    }
}

/* ################################################### */
/* ###### My Account - Order History Details ######### */
/* ################################################### */

@media (min-width: 425px) {
    .order-info-action {
        display: flex !important;
        justify-content: flex-start;
    }
}

@media (max-width: 1024px) {
    div.slds-accordion__summary {
        background-color: transparent;
    }
}

.order-detail-summary {
    .slds-accordion__summary-heading .slds-button:focus {
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
    }
}

/* ################################ */
/* ###### Footer Styles ########### */
/* ################################ */

footer {
    background-color: var(--rig-primary-color);
    color: white;
    margin-top: 2.5rem;

    .footer {
        .rig-footer-links {
            .column-content {
                @media only screen and (min-width: 48em) and (max-width: 64em) {
                    --dxp-c-l-section-vertical-align: start !important;
                    --dxp-c-section-vertical-align: start !important;
                    --dxp-c-region-wrapper-vertical-align: start !important;
                }

                @media only screen and (min-width: 64.0625em) {
                    --dxp-c-l-section-vertical-align: start !important;
                    --dxp-c-section-vertical-align: start !important;
                    --dxp-c-region-wrapper-vertical-align: start !important;
                }
            }
        }

        .rig-footer-buttons {
            --dxp-c-l-column-vertical-align: flex-end !important;
             .column-content{
                .rig-footer-left-btn {
                    display: flex !important;
                    justify-content: flex-end !important;
                    align-items: flex-end;
                    --dxp-c-l-section-vertical-align: end !important;
                    --dxp-c-section-vertical-align: end !important;
                    --dxp-c-region-wrapper-vertical-align: end !important;

                    @media only screen and (min-width: 48em) and (max-width: 64em) {
                        display: flex !important;
                        justify-content: flex-end !important;
                        align-items: flex-end !important;
                        --dxp-c-l-section-vertical-align: end !important;
                        --dxp-c-section-vertical-align: end !important;
                        --dxp-c-region-wrapper-vertical-align: end !important;
                    }

                    @media only screen and (min-width: 64.0625em) {
                        display: flex !important;
                        justify-content: flex-end !important;
                        align-items: flex-end !important;
                        --dxp-c-l-section-vertical-align: end !important;
                        --dxp-c-section-vertical-align: end !important;
                        --dxp-c-region-wrapper-vertical-align: end !important;
                    }
                }
            }
        }

        a:not(.slds-button,.slds-dropdown__item > a) {
            color: white;
            text-decoration: none;

            &:hover {
                text-decoration: underline;
            }
        }

        .slds-button_outline-brand {
            width: 9.5rem;
        }

        .slds-button_outline-brand:focus,
        .slds-button_outline-brand:hover {
            background-color: transparent;
            color: white;
            border-color: white;
        }

        /* Note: hier könnte es evtl. Probleme geben bzgl. dem Header, da Footer und Header
            wahrscheinlich dieselben Klassen haben. Im Moment kann ich das nicht einschätzen,
            weil der Header in kleineren Viewports ausgeblendet ist.
            Bugticket dafür ist erstellt: RIG-435 */
        .dxp-content-layout-site-logo {
            img {
                width: auto;
            }

            @media only screen and (max-width: 768px) {
                img {
                    max-width: 200px;
                    max-height: 50px!important;
                }
            }
        }

        .recaptcha-info {
            font-size: 9px;
            display: flex;
            justify-content: center;
            white-space: pre;
            flex-wrap:wrap;

            a {
                font-weight: bold !important;
            }
        }

        @media (max-width: 767px) {
            .recaptcha-info {
                font-size: 9px;
            }
        }
    }
}

/* ################################ */
/* ###### Order History List ###### */
/* ################################ */
.button-container {
    display: flex;
    justify-content: flex-end;
    column-gap:1rem;
    padding-right: 0 !important;

    .button {
        margin: unset;
    }
}

@media (max-width: 1118px) {
    .button-container {
        justify-content: flex-start;
    }

    .form-container {
        display: flex;
        flex-wrap: wrap;
    }

    .form-container .filter {
        width: 50%;
    }

    .form-container .button {
        width: 50%;
    }
}

.wrapper {
    margin-bottom: 3rem;
    border: 0.063rem solid var(--rig-middle-gray-color);
    overflow: hidden;
}

h3.dxp-text-bold {
    font-size: 24px;
    font-weight: bold;
}

.newsletter-info {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}

.order-header {
    background-color: var(--rig-lighter-blue);
}

.order-header .order-info,
.order-header .order-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: baseline;
}

.order-actions {
    gap: 0.75rem;
    margin-left: 1.25rem;
    margin-top: 0;

    .order-link {
        --dxp-s-link-text-decoration: none;
    }

    button {
        white-space: nowrap;

        @media (max-width: 600px) {
            .order-actions {
                flex-direction: column;
                align-items: flex-end;
            }
        }
    }
}

@media (max-width: 1277px) {
    .order-actions {
        flex-direction:column-reverse;
        align-items: center !important;
    }
}

@media (max-width: 768px) {
    h3.dxp-text-bold {
        font-size: 22.5px;
    }
}

@media (max-width: 600px) {
    .order-header {
        flex-direction: column;
        display: flex;
        align-items: flex-start !important;
    }

    .order-header .order-actions {
        justify-content: flex-start;
        width: 100%;
        gap: 0.5rem;
        margin-left: 0;
        margin-top: 1.875rem;
    }

    .order-actions {
        flex-direction:row-reverse;
        justify-content: flex-end !important;
    }
}

.order-detail {
    padding: 1rem;
    font-size: 1.125rem;

    .slds-grid {
        flex-direction: column;
    }

    .bold {
        font-weight: bold;
    }

    .field-cnt {
        display: flex;
        flex-wrap: wrap;
        margin-top: 0.938rem;
    }

    @media (max-width: 706px) {
        .field-cnt {
            flex-direction: column;
        }
    }
}

.left-column {
    flex: 1;
    min-width: 18.75rem;
    line-height: 1.7;
    margin-right: 2rem
;
}

.right-column {
    flex: 1;
    min-width: 18.75rem;
    line-height: 1.7;
}

.font-size-smaller {
    font-size: 1rem;
}

.font-size-small {
    font-size: 1.125rem;
    line-height: 1;
}

.media-container {
    container-type: inline-size;
    container-name: media-container;
    width: 80%;

    .image-area {
        display: grid;
        grid-auto-columns: minmax(0, 1fr);
        gap: 0.4rem;
        grid-template-columns: repeat(7, 1fr);

        @container media-container (max-width: 48em) {
            grid-auto-flow: initial;
            grid-template-columns: repeat(3, 1fr);
        }

        @media only screen and (min-width: 48em) {
            gap: 0.5rem;
        }

        @media only screen and (min-width: 64em) {
            gap: 0.75rem;
        }
    }
}

.order-summary-content-layout {
    webruntime-component-container community_layout-section {
        h1 {
            /* text-wrap: wrap; */
        }

        div:last-of-type {
            /*flex-direction:column !important;*/
        }

        community_layout-column {
            /* width: fit-content; */
        }
    }
}

/* ######################## */
/* ###### Cart Page ####### */
/* ######################## */
commerce_cart-managed-contents, commerce_cart-items {
    .sort-menu {
        margin-bottom: 0 !important;
    }

    .slds-pill__label {
        white-space: normal;
    }

    .unitPrice, .actualPrice {
        font-size: 24px !important;
        margin-left: 0 !important;
    }

    .container {
        grid-template-rows: repeat(4, auto) !important;
        grid-template-columns: 12rem auto auto !important;
        grid-template-areas:
            "image name prices"
            "image details-pills-qty unit"
            "image details-pills-qty unit"
            "image delete delete" !important;
    }

    .item-image {
        margin-right: 20px !important;
    }

    .item-delete {
        button {
            padding-inline: 0;
        }
    }

    footer {
        display: none !important;
    }

    .originalPrice{
        margin-right:0.5rem;
    }

    /* Tablet Viewport */
    @media only screen and (max-width: 1440px) {
        .item-unit-price {
            justify-self: end !important;
        }

        .item-prices {
            justify-self: end !important;
            align-self: end !important;
        }
    }

    /* Mobile Viewport */
    @media only screen and (max-width: 600px) {
        .container {
            grid-template-rows: repeat(4, auto) !important;
            grid-template-columns: 9.25rem 1fr !important;
            grid-template-areas:
                "image name"
                "image details-pills-qty"
                "image prices"
                "image delete" !important;
        }

        .unitPrice, .actualPrice {
            font-size: 20px !important;
        }

        .item-prices {
            justify-self: start !important;
            align-self: start !important;
            /*margin-top: var(--dxp-g-spacing-xxsmall)*/
        }

        .item-unit-price {
            display: none !important;
        }

        .item-delete {
            button {

            }
        }
    }
}

/* ######################## */
/* ###### Mini Cart ####### */
/* ######################## */
/* Minicart overlay (custom element) + panel-scoped fallback for minicart items */

commerce_cart-mini-cart-panel
{
    min-width: 670px;
}

/* ############################ */
/* ###### Checkout Page ####### */
/* ############################ */
.rig-checkout-order-details {
    position: sticky;
    top: 5.938rem;
}

commerce_builder-checkout-layout-one-page-dual{
    min-height: unset !important;
}

commerce_data_provider-checkout-data-provider {
    .slds-pill__label {
        white-space: normal;
    }

    commerce_cart-items {
        .slds-pill__label {
            white-space: normal;
        }

        .unitPrice, .actualPrice {
            font-size: 20px !important;
        }

        .container {
            grid-template-rows: auto 1fr !important;
            grid-template-columns: 12rem 2fr 1fr !important;
            grid-template-areas:
                "image name prices"
                "image details-pills-qty unit" !important;
        }

        .item-image {
            margin-right: 20px !important;
        }

        /* Tablet Viewport */
        @media only screen and (max-width: 1440px) {
            .item-prices {
                justify-self: start !important;
                align-self: start !important;
            }

            .container {
                grid-template-rows: auto auto 1fr !important;
                grid-template-columns: 12rem 1fr !important;
                grid-template-areas:
                    "image name"
                    "image details-pills-qty"
                    "image prices" !important;
            }

            .unitPrice, .actualPrice {
                font-size: 20px !important;
            }

            .item-unit-price {
                display: none !important;
            }
        }

        @media only screen and (max-width: 490px) {
            .item-image {
                height: 215px;
                display: grid;
                justify-content: center;
            }

            .item-prices {
                justify-self: start !important;
                align-self: start !important;
                /*margin-top: var(--dxp-g-spacing-xxsmall)*/
            }
            .container {
                grid-template-rows: auto auto auto 1fr !important;
                grid-template-columns: 1fr !important;
                grid-template-areas:
                    "image"
                    "name"
                    "details-pills-qty"
                    "prices" !important;
            }
        }
    }
}

/* ################################## */
/* ###### Product Detail Page ####### */
/* ################################## */

.rig-details {
    @media only screen and (max-width: 1199px) {
        .columns-content {
            flex-direction: column !important;
        }
    }

    /* Ab Tablet Viewport */
    @media only screen and (max-width: 48em) {
        .quantity-list-action {
            > commerce_product_details-add-quantity {
                margin-block: 0 !important;

                .container {
                    gap: 1rem;
                }

                commerce-quantity-selector {
                    margin-bottom: 0 !important;
                    margin-right: 0 !important;
                }

                commerce-action-button{
                    margin-right: 0 !important;
                }
            }

            > commerce-action-button {
                margin: 0 !important;
                margin-top: 1rem !important;
            }
        }

    }

    @media only screen and (min-width: 48.0625em) {
        commerce-product-variant-selector {
            max-width: unset
        }
    }
}


commerce_data_provider-product-data-provider {
    .quantity-list-action{
        flex-wrap:wrap;
    }
}

commerce_product_details-fields-table {
    tr {
        td:first-of-type {
            font-weight: bold;
        }
    }

    @media only screen and (max-width: 768px) {
        tr {
            display: flex;
            flex-direction: column;
        }
    }
}

commerce-product-variant-selector {
    h2 {
        font-weight: bold !important;
    }
}

/* ################################ */
/* ###### Product List Page ####### */
/* ################################ */

commerce_builder-search-results-layout {
    @media only screen and (max-width: 64em) {
        .left-container {
            z-index: 1000;
        }
    }
}

/* Category Container */
.rig-categories {
    .header-container {
        h3 {
            --dxp-s-text-heading-large-font-size: 1.75rem;
            font-weight: 700 !important;
        }
    }

    .columns-content {
        .column-content {
            .component-wrapper-spacer {
                margin: 0;
            }

            .header-container {
                div {
                    padding-top: 0;
                    padding-bottom: 0;
                }
            }
        }
    }

    .menu-container {
        .menu {
            .carousel-container {
                .slds-truncate {
                    white-space: break-spaces;
                    text-align: left;
                }

                .fieldsArea {
                    height: fit-content;
                }

                a, a:link:not(.slds-button, .slds-dropdown__item > a) {
                    --dxp-s-link-text-decoration: none;
                    color: var(--rig-primary-color);
                }

                a, a:hover:not(.slds-button,.slds-dropdown__item > a) {
                    color: var(--rig-primary-color-hover);
                }
            }

            .product-card {
                section {
                    width: 9.375rem !important; /* Necessary to override Salesforce inline styles */
                }
            }

            .card-container {
                justify-content: center;
            }

            .card-container * {
                width: auto;
                hyphens: auto;
            }

            ul {
                gap: 1rem;
            }

            /* Tablet Viewport */
            @media only screen and (max-width: 1024px) {
                .carousel-container {
                    flex-wrap: wrap !important; /* Necessary to override Salesforce inline styles */
                }

                .product-card {
                    section {
                        width: 6.875rem !important; /* Necessary to override Salesforce inline styles */
                    }
                }
            }

            /* Mobile Viewport */
            @media only screen and (max-width: 768px) {
                .carousel-container {
                    li {
                        min-width: auto;
                    }
                }
            }
        }
    }
}


/* Product Container */
.rig-category-products {
    .card-item {
        a, a:hover:not(.slds-button,.slds-dropdown__item > a) {
            text-decoration: none;
        }

        span {
            text-wrap: wrap;
            hyphens: auto;
        }

        .price-container {
            flex-direction:column;
        }
    }

    .product-grid-container > li {
        align-items: flex-start;

        .imageArea.c-searchProductCard_searchProductCard {
            justify-content: start;
        }

        img {
            height: 150px;
        }
    }

    .c-searchProductField_searchProductField-host{
        justify-content:flex-start;
    }

    .c-searchProductField_searchProductField-host > div.c-searchProductField_searchProductField {
        height: 6rem;
    }

    @media only screen and (max-width: 768px) {
        .grid-item.c-searchProductGrid_searchProductGrid {
            flex-basis: 50% !important;
        }

        img {
            width: auto !important;
            height: 220px;
        }
    }
}

/* Sorting Menu */
.panel-class {
    .footer {
        flex-direction: column-reverse !important; /* Necessary to override Salesforce inline styles */

        .slds-button.slds-button_brand {
            background-color: var(--rig-primary-color);
            border-color: var(--rig-primary-color);
            margin-block: 1rem;
        }
    }

    .header-and-body{
        .close-button, figure {
            align-self:center !important;
        }
    }
}

.sorting-menu {
    @media only screen and (max-width: 1024px) {
        .sort-filter-button {
            text-decoration: none !important; /* Necessary to override Salesforce inline styles */
            background-color: var(--rig-primary-color) !important; /* Necessary to override Salesforce inline styles */
            color: white;
            padding: 0.313rem 0.938rem !important; /* Necessary to override Salesforce inline styles */
            border-radius: 3.125rem;
            border: none;
            display: flex;
            align-items: center;
        }
    }
}

@media only screen and (max-width: 500px) {
    .search-container .content-container {
        .header-container {
            flex-direction: column !important; /* Necessary to override Salesforce inline styles */
            align-items: center;
            gap: 1rem;
            padding: 0 !important; /* Necessary to override Salesforce inline styles */
        }
    }

    c-search-paging-control {
        .slds-m-horizontal_small {
            margin-left: 0px !important;
            margin-right: 0px !important;
        }
    }
}

commerce_builder-breadcrumbs{
    li {
        line-height:19px;
        font-size:1rem;
    }
}

/* ################################ */
/* ###### Address List Page ####### */
/* ################################ */

.rig-add-address-btn {
    width: max-content;
    margin-bottom: 0.625rem;
}

.rig-address-list {
    .address-container .address-card-style-class {
        border-radius: .25rem !important; /* Necessary to override Salesforce inline styles */
        --dxp-g-neutral-3: var(--rig-address-box-gray);
    }

    a, a:link:not(.slds-button, .slds-dropdown__item > a), a:visited:not(.slds-button, .slds-dropdown__item > a) {
        --dxp-s-link-text-decoration: none;
    }

    .slds-tabs_default__item.slds-is-active .slds-tabs_default__link:hover {
        color: var(--rig-primary-color-hover);
    }

    commerce_my_account-my-account-address-footer {
        display: none !important;
    }

    .default-badge-style-class {
        max-width: 50% !important; /* Necessary to override Salesforce inline styles */
    }
}

/* ######################################## */
/* ###### Account Navigation Styles ####### */
/* ######################################## */

.rig-account-nav {
    a, a:link:not(.slds-button, .slds-dropdown__item > a), a:visited:not(.slds-button, .slds-dropdown__item > a) {
        --dxp-s-link-text-decoration: none;
    }
}

/* ################################ */
/* ###### Quantity Counters ####### */
/* ################################ */

.rig-class-for-counter {
    .number-input__decrement-button, .number-input__increment-button {
        border: none !important; /* Necessary to override Salesforce inline styles */
    }

    .number-input__decrement-button, .number-input__increment-button,
    .number-input__decrement-button .slds-button[disabled], .slds-button:disabled,
    .number-input__increment-button .slds-button[disabled], .slds-button:disabled {
        border: 1px solid transparent;

        &:hover {
            border-color: transparent;
        }

        svg {
            fill: var(--rig-gray-color);

            &:hover {
                fill: var(--rig-brown-gray-color);
            }
        }
    }

    .number-input__input {
        border: none;

        &:active, &:focus {
            border: none !important;
            box-shadow: none !important;
        }
    }

    .slds-grid.slds-grid_vertical-align-center.slds-nowrap:has(.number-input__increment-button, .number-input__decrement-button) {
        border: 1px solid var(--rig-gray-color);
        border-radius: 3.125rem;
        padding-inline: 1rem;
    }

    .slds-grid.slds-grid_vertical-align-center.slds-nowrap:has(.number-input__input:active, .number-input__input:focus) {
        border-color: var(--rig-secondary-color);
    }
}

/* ########################### */
/* ###### Contact Form ####### */
/* ########################### */
c-rig-b2b-contact-form {
    .slds-p-around_medium {
        --dxp-g-spacing-medium: 0;
    }

    .slds-card__header {
        padding-top: .3rem;
    }
}

c-rig-b2b-contact-form {
    lightning-card {
        display:flex;
        justify-content:center;

        article {
            width:50%;
        }
    }

    .slds-form-element__label {
        font-family: "RIG Ubuntu";
    }

    .slds-input, .slds-textarea {
        font-family: "RIG Roboto"
    }

    .slds-card {
        border: none;
        box-shadow: none;
    }

    .slds-form-element {
        margin-inline:0;
    }

    .slds-textarea:focus, .slds-textarea:active {
        border: 1px solid var(--rig-secondary-color) !important;
        box-shadow: 0 0 2px var(--rig-secondary-color) !important;
    }

    lightning-button{
        justify-content: flex-start !important;
    }

    @media only screen and (max-width: 768px) {
        .slds-button{
            width: 100%;
        }
    }
}

/* ########################## */
/* ###### Adress Form ####### */
/* ########################## */

.rigB2BaddressForm {
    min-width: 50%;
    align-self: center;

    lightning-input-address {

        lightning-picklist[data-field="country"] {
            margin: 0;
            padding-inline: 0 !important;

            input{
                padding-left: 12px !important;
            }
        }

        lightning-input[data-field="city"] {
            width: -webkit-fill-available;
        }

        lightning-input[data-field="province"] {
            display:none;
        }
    }
}

.adress_form-heading h2{
    hyphens: auto;
    text-align: start !important;
}

commerce_my_account-my-account-input-address {
    lightning-input, lightning-combobox, lightning-picklist {
        padding-inline: 0 !important;
    }

    lightning-input, lightning-picklist {
        margin-bottom: 6px !important;
    }

    lightning-combobox:first-of-type {
        margin-bottom: 6px;
    }

    input[name="province"] {
        padding-left: 11.25px !important;
    }

    .address-type {
        display: flex;
        flex-direction: column;
    }

    @media only screen and (max-width: 768px) {
        .name-fields {
            display:flex !important;
            flex-direction: row;
        }
    }

    @media only screen and (max-width: 425px) {
        .action-buttons {
            display: flex;
            flex-direction: column;

            button{
                margin-inline:0 !important;
                margin-top: 11.25px;
                width: 100%;
                max-width: 100% !important;
            }
        }

        .name-fields {
            display:flex !important;
            flex-direction: column;

            lightning-input {
                width: 100%;
            }
        }
    }
}

/* #################### */
/* ###### Login ####### */
/* #################### */

.login-logo-container, .register-logo-container {
    margin-top: 1.5rem;
    margin-bottom: 3.5rem;
    img {
        max-height: unset !important;
        height: 3rem;
    }
}

/* ################################### */
/* ###### Category Filter List ####### */
/* ################################### */

commerce-search-filters {
    .section-header {
        h3 {
            --dxp-s-text-heading-medium-font-family: "RIG Ubuntu", sans-serif;
            --dxp-s-text-heading-medium-font-size: 1.125rem;
            --dxp-s-text-heading-medium-font-weight: 700;
            --dxp-s-text-heading-small-font-weight:700;
        }
    }

    .parent-category{
        button{
            line-height:19px;
            font-size:1rem;
        }
    }

    .filters-header {
        --dxp-s-text-heading-small-font-weight: 700;
        --dxp-s-text-heading-medium-font-family: "RIG Ubuntu", sans-serif;
        --dxp-s-text-heading-large-font-size: 1.25rem;
        line-height:24px;
    }

    .clear-button {
        lightning-button{
            text-decoration:none;
            &:hover{
                text-decoration:none;
            }
            &:focus{
                text-decoration:none;
            }
        }
        button {
            font-family: "RIG Roboto", sans-serif;
            color: var(--rig-primary-color);
            font-size: 1rem;
            line-height:19px;

            &:hover {
                color: var(--rig-primary-color-hover);
                cursor: pointer;
            }

            &:disabled{
                display:none;
            }
        }
    }

    .category-list {
        padding-left: 0.938rem;

        h3 {
            --com-c-link-list-font-size: 1rem;
            --com-c-link-list-font-weight: 400;
            --com-c-link-list-font-family: "RIG Roboto", sans-serif;
        }

        li {
            --com-c-link-list-font-size: 1rem;
            --com-c-link-list-font-weight: 400;
            --com-c-link-list-font-family: "RIG Roboto", sans-serif;
            line-height: 22px;
        }
    }
}

/* ########################## */
/* ###### Back Button ####### */
/* ########################## */

.rig-footer-left-btn {
    display: flex;
    justify-content: flex-end;
}

/* ########################## */
/* ###### Sorting Menu ###### */
/* ########################## */

.rig-sorting-menu {
    .slds-button {
        --dxp-s-button-font-weight: 400;
        font-weight: 400;
        line-height:19px;
    }
}

/* ########################## */
/* #### Filters element ##### */
/* ########################## */

commerce_builder-search-filters {
    .slds-form-element__label {
        --dxp-s-form-element-label-font-size: 16px;
        --dxp-s-form-element-label-font-family: "RIG Roboto", sans-serif
    }
}

commerce-search-filters-panel-section {
    commerce_search-facet-item{
        span,.facet-item-name{
            line-height:19px;
        }
    }

    .section-header{
        h3{
            font-weight: 500;
            font-family: "RIG Ubuntu", sans-serif;
            font-size: 1rem;
            line-height:21px;
            letter-spacing:0;
        }
    }
}

commerce_builder-search-no-results-layout{
    .header-container{
        padding: 0.5rem 1rem !important;
        .search-header{
            --dxp-s-text-heading-small-font-weight: 700;
            --dxp-s-text-heading-medium-font-family: "RIG Ubuntu", sans-serif;
            --dxp-s-text-heading-large-font-size: 1.25rem;
            line-height:24px;
        }
        .sort-menu-dropdown{
            line-height:19px;
        }
    }
}

c-rig-b2-bnewsletter-link {
    display: flex;
    width: 100% !important;
    a{
        width: 100% !important;
        text-align: left !important;
        background-color: #ffffff00 !important;
        font-weight: bold !important;
        font-style: normal !important;
        font-size: 14px !important;
    }

    @media (max-width: 1024px) {
        a{
            font-size: 13.125px !important;
        }
    }

}

commerce_builder-product-pricing-details {
    margin-bottom: 0 !important;
}