.cartContainer {
    min-height:75vh;
}
.cartProcess {
    display: flex;
    justify-content: space-around;
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
}

.processSteps {
    width: 40px;
    height: 40px;
    text-align: center;
    align-content: center;
    margin-top: 5px;
    border-radius: 100px;
    margin-bottom: 5px;
}

.cart-container {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    border-bottom: solid var(--grey-color-500) 1px;
    padding-top:2rem;
    padding-bottom:2rem;
}

.cart-container img {
    max-width: 200px;
}

.loggedOutImage {
    max-width: 180px;
}

.warrantyDesciprion {
    grid-column: span 1;
}


.warrantyPriceLine {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.warrantyTotalPriceContainer {
    grid-column: span 1;
    text-align: end;
    position: relative;
}


.buttonRemoveContainer {
    grid-column: span 5;
    text-align: end;
}


.productImageContainer {
    grid-row: span 2;
}


.loggedOutImage {
    max-width: 180px;
}


.swal2-popup {
    font-family: var(--primaryFont) !important; 
}

.mainButton {
    background-color: var(--primary-color);
    color: white;
    border-radius: 2px;
}

.buttonOutFocus {
    background-color: #dddddd;
    border-radius: 2px;
}

.singleUnitPriceContainer {
    text-align: center;
    margin-top: auto;
    margin-bottom: auto;
}

.quantity-container {
    margin-left: auto;
    margin-right: auto;
    border: solid var(--grey-color-500) 1px;
    padding: 6px 15px;
    border-radius: 2px;
}

.fixed-quantity {
    margin-left: auto;
    margin-right: auto;
}

.quantitygridContainer {
    max-width: 145px;
    margin: auto;
}


.quantity-container input {
    max-width: 75px;
    text-align: center;
    background-color: transparent;
    border: none;
    outline: none;
}

.removeItemBtn:hover {
    color: var(--red-color)
}

.desriptionContainer {
    margin-top: auto;
    margin-bottom: auto;
}

.discountsContainer {
    max-width: 400px;
}

.discountsContainer input{
    background-color:transparent;
    outline:none;
}

.discountsContainer input::placeholder {
    color: var( --grey-color-300);
}

.cartSummaryContainer {
    border: solid var(--grey-color-700) 2px;
    border-radius: 2px;
}


.inputDiscountContainer {
    background-color: white;
    border: solid var(--grey-color-400) 1px;
    border-radius: 2px;
}

.total-line-price-total {
    margin-top: auto;
    margin-bottom: auto;
    text-align: end;
    position: relative;
}

.total-line-offer {
    margin-top: auto;
    margin-bottom: auto;
    text-align: end;
    position: relative;
}

.specialOfferUnit {
    text-align: center;
    margin-top: auto;
    margin-bottom: auto;
}

.priceBadge {
    top: -22px;
    position: absolute;
    right: 0px;
    text-wrap: nowrap;
}

.splitDeliveryContainer img {
    max-width:150px;

}

.splitDeliveryContainer .productDetailsContainer {
    max-width: 600px;
    min-width:600px
}
.splitDeliveryContainer .productCode {
    text-align:end;
}


/*Success Page*/
.checkmark {
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    stroke-width: 2;
    stroke: var(--green-color);
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px var(--green-color);
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: var(--green-color);
    fill: #00000000;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@media(max-width:1200px) {
    .cart-container {
        grid-template-columns: repeat(6, 1fr);
    }

    .desriptionContainer {
        grid-column: span 2;
        padding-left: 2rem;
    }

    .warrantyDesciprion {
        grid-column: span 2;
        padding-left: 2rem;
    }

    .buttonRemoveContainer {
        grid-column: span 6;
    }
}

@media(max-width:950px) {
  
    .quantity-container input {
        max-width:60px;
    }


    .desriptionContainer {
        grid-column: span 2;
        padding-left: 2rem;
    }

    .warrantyDesciprion {
        grid-column: span 2;
        padding-left: 2rem;
    }

    .buttonRemoveContainer {
        grid-column: span 6;
    }

}

@media(max-width:900px) {

    .cart-container {
        grid-template-columns: repeat(5, 1fr);
        grid-template-areas:
            "productImage productDescription productDescription productDescription productDescription"
            "productImage warrantyDescription warrantyDescription warrantyPrice warrantyTotal"
            "productImage quantityContainer   quantityContainer  singleUnitPrice    priceTotal"
            "removeItemBtn removeItemBtn   removeItemBtn  removeItemBtn    removeItemBtn";
        gap: 10px;
    }

    .buttonRemoveContainer {
        grid-area: removeItemBtn;
    }

    .productImageContainer {
        margin-top: auto;
        margin-bottom: auto;
        grid-area: productImage;
    }

    .desriptionContainer {
        padding-left: 1rem;
        grid-area: productDescription;
    }

    .singleUnitPriceContainer {
        grid-area: singleUnitPrice;
    }

    .quantitygridContainer {
        grid-area: quantityContainer;
        padding-left: 1rem;
        margin: 0;
    }

    .total-line-price-total {
        grid-area: priceTotal;
    }

    .warrantyDesciprion {
        grid-area: warrantyDescription;
        padding-left: 1rem;
    }

    .warrantyPriceLine {
        grid-area: warrantyPrice;
    }

    .warrantyTotalPriceContainer {
        grid-area: warrantyTotal;
    }

    .fixed-quantity {
        grid-column: span 3;
    }

}

@media(max-width:767px) {
    .splitDeliveryContainer .productCode {
        text-align: start;
    }

    #CartCheckoutSummary {
        padding: 0 !important;
        margin: 0 !important;
    }

    .splitDeliveryContainer .textContainer {
        text-align: center
    }

    .splitDeliveryContainer .outerTextContainer {
        padding: 15px 0;
    }

    .splitDeliveryContainer .imgContainer {
        display: flex;
        justify-content: center;
    }

    .splitDeliveryContainer .qtyContainer {
        text-align: center;
    }

    .splitDeliveryContainer .productCode {
        text-align: center;
    }
}

@media(max-width:600px) {


    .cart-container {
        grid-template-columns: repeat(4, 1fr);
        grid-template-areas:
            "productImage productImage productImage productImage "
            "productDescription productDescription productDescription productDescription"
            "warrantyDescription warrantyDescription warrantyPrice warrantyTotal"
            "quantityContainer   quantityContainer  singleUnitPrice priceTotal "
            "removeItemBtn removeItemBtn removeItemBtn removeItemBtn ";
        gap: 10px;
    }
/*
    .productImageContainer {
        grid-row: span 1;
        grid-column: span 6;
    }

    .desriptionContainer {
        grid-column: span 6;
        padding: 1rem 0rem;
    }

    .singleUnitPriceContainer {
        text-align: start;
        grid-column: span 2;
    }

    .specialOfferUnit {
        text-align: start;
        grid-column: span 2;
    }

    .quantity-container {
        grid-column: span 2;
    }

    .fixed-quantity {
        grid-column: span 2;
    }

    .quantity-container input {
        max-width: 50px;
    }

    .total-line-price-total {
        grid-column: span 2;
    }

    .total-line-offer {
        grid-column: span 2;
    }*/
}





@media(max-width:349px) {

    .cart-container {
        grid-template-columns: repeat(2, 1fr);
        grid-template-areas:
            "productImage productImage "
            "productDescription productDescription "
            "warrantyDescription warrantyDescription"
            "quantityContainer  quantityContainer"
            "singleUnitPrice priceTotal"
            "warrantyPrice warrantyTotal"
            "removeItemBtn removeItemBtn";
        gap: 10px;
    }
    .desriptionContainer {
        padding:0;
    }
    .quantitygridContainer {
        padding:0;
    }
    .singleUnitPriceContainer {
        text-align:start;
    }
    .warrantyDesciprion {
        padding:0;
    }
    .warrantyPriceLine {
        text-align:start;
        margin:0;
    }
}

@media(max-width:320px) {
    .priceBadge {
        display:none;
    }
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {
    0%, 100% {
        transform: none;
    }

    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 2px var(--green-color);
    }
}