.simpleCart_items {
    user-select: none;
}

.headerRow, .itemRow {
    display: flex;
    flex-direction: row;
    /*flex-wrap: wrap;*/
    align-items: center;
}

.headerRow > div, .itemRow > div {
    flex-basis: 12.5%;
    flex-basis: 17.5%;
    flex-basis: 18%;
    text-align: center;
}

.itemRow  + .itemRow {
    border-top: 1px solid white;
    padding-top: 30px;
}


.headerRow {
    margin-bottom: 40px;
}

.itemRow {
    padding-bottom: 30px;
}

.headerRow .item-name, .itemRow .item-name {
    flex-basis: 29%;
    flex-basis: 25%;
    text-align: left;
    padding-left: 40px;

}

.headerRow .item-decrement, .itemRow .item-decrement {
    text-align: right;
    flex-basis: 5%;
    font-size: 2rem;
}

.itemRow .item-decrement a {
    padding: 0 20px;
    border: 1px solid var(--e-global-color-accent);
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    height: 50px;
    line-height: 50px;
    display: inline-block;
    user-select: none;

}

.headerRow .item-quantity, .itemRow .item-quantity {
    flex-basis: 6%;
    flex-basis: 5%;
}

.itemRow .item-quantity {
    border-top: 1px solid var(--e-global-color-accent);
    border-bottom: 1px solid var(--e-global-color-accent);
    height: 50px;
    line-height: 50px;
}

.itemRow .item-quantity input[type="text"] {
    border: 0;
    padding: 0;
    height: 100%;
    background-color: transparent;
    color: var(--e-global-color-text);
    text-align: center;
}

.itemRow .item-quantity input[type="text"]:focus {
    /*outline: none; !* Entfernt den Standardrahmen bei Fokus *!*/
    /*border-color: #ccc; !* Setzt die Randfarbe, wenn das Feld fokussiert ist *!*/
    /*box-shadow: none; !* Entfernt eventuelle Schatteneffekte beim Fokus *!*/
    background-color: transparent; /* Setzt eine gewünschte Hintergrundfarbe beim Fokus */
    color: var(--e-global-color-text);
}

.headerRow .item-increment, .itemRow .item-increment {
    text-align: left;
    flex-basis: 5%;
    /*flex-basis: 6%;*/
    font-size: 2rem;

}

.itemRow .item-increment a {
    padding: 0 20px;
    border: 1px solid var(--e-global-color-accent);
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    height: 50px;
    line-height: 50px;
    display: inline-block;
}

.headerRow  .item-price, .itemRow .item-price {
    /*flex-basis: 15%;*/
}

.headerRow  .item-total, .itemRow .item-total {
    /*flex-basis: 17.5%;*/
}

.headerRow  .item-remove, .itemRow .item-remove {
    flex-basis: 5%;
}


/* Entfernt die Pfeile in Webkit-basierten Browsern (z.B. Chrome, Safari) */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Entfernt die Pfeile in Firefox */
input[type="number"] {
    -moz-appearance: textfield;
}

@keyframes rustle {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(-6deg); }
    50% { transform: rotate(6deg); }
    75% { transform: rotate(-6deg); }
    100% { transform: rotate(0deg); }
}

.cartInfo svg.rustle {
    animation: rustle 0.4s ease;
}

.simpleCart_checkout {
    display: none;
}


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

    .headerRow, .itemRow {
        /*flex-wrap: wrap;*/
        /*margin-bottom: 20px;*/
    }


    .headerRow > div, .itemRow > div {
        flex-basis: 13%;
    }

    .headerRow .item-name, .itemRow .item-name {
        flex-basis: 30%;
        padding-left: 20px;
    }

    .headerRow .item-quantity, .itemRow .item-quantity {
        flex-basis: 7%;
    }
}

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

    .headerRow, .itemRow {
        /*flex-wrap: wrap;*/
        /*margin-bottom: 20px;*/
    }

    .headerRow > div, .itemRow > div {
        flex-basis: 17%;
    }


    .item-image {
        display: none;
    }

    .headerRow .item-name, .itemRow .item-name {
        flex-basis: 30%;
        padding-left: 0;
    }

    .headerRow .item-decrement, .itemRow .item-decrement {
        flex-basis: 7%;
    }

    .headerRow .item-quantity, .itemRow .item-quantity {
        flex-basis: 7%;
    }

    .headerRow .item-increment, .itemRow .item-increment {
        flex-basis: 7%;

    }

    .headerRow .item-remove, .itemRow .item-remove {
        /*margin-top: 15px;*/
        /*margin-bottom: 15px;*/
    }

}

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

    .item-image {
    }

    .itemRow .item-name {
        /*flex-basis: 30%;*/
        /*padding-left: 20px;*/
    }

    .headerRow .item-quantity, .itemRow .item-quantity {
        flex-basis: 9%;
    }


    .headerRow .item-remove, .itemRow .item-remove {
    }




}


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

    .headerRow, .itemRow {
        flex-wrap: wrap;
        /*margin-bottom: 20px;*/
    }

    .headerRow {
        display: none;
    }
    .itemRow {
        /*margin-bottom: 25px;*/
        /*border-bottom: 1px solid white;*/
        /*padding-bottom: 0;*/
    }

    .itemRow  + .itemRow {
        border-top: 1px solid white;
        padding-top: 30px;
    }


    .item-image {
        display: none;
    }

    .itemRow .item-name {
        flex-basis: 100%;
        text-align: left;
        margin-bottom: 15px;
        padding-left: 5px;
    }

    .itemRow .item-quantity {
        flex-basis: 16%;
    }

    .itemRow .item-price {
        display: none;
    }

    /*.itemRow .item-price, .itemRow .item-total {*/
    .itemRow .item-total {
        flex-basis: 50%;
        /*margin-top: 20px;*/


    }

/*    .itemRow .item-price::before {
        content: "Betrag: ";
        margin-right: 15px;
    }*/

    .itemRow .item-total::before {
        /*content: "Summe: ";*/
        /*margin-right: 15px;*/

    }

    .itemRow .item-remove {
        margin-top: 20px;
        flex-basis: 100%;
        text-align: right;
        margin-right: 15px;
        /*text-align: left;*/
        margin-top: 25px;


    }



    .itemRow div {
        /*flex-basis: auto;*/
        /*width: auto;*/
        /*text-align: center;*/
    }

    .item-price, .item-total, .item-quantity, .item-decrement, .item-increment, .item-remove {
        /*flex-basis: 25%;*/
        /*width: 25%;*/
    }
}


