.cart-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius: var(--border-radius-md);
    border: 1px solid var(--cultured);
    padding: 15px;
    justify-content: space-between;
    align-items: center;
    min-width: 250px;
}
.cart-final {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    min-width: 200px;
}



.cart-item-title {
    color: var(--eerie-black);
    font-size: var(--fs-8);
    font-weight: var(--weight-600);
    text-transform: capitalize;
    /* white-space: nowrap; */
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 2px;
    display: inline;
}

.cart-item-category {
    width: max-content;
    color: var(--davys-gray);
    font-size: var(--fs-8);
    text-transform: capitalize;
    margin-bottom: 3px;
}

.cart-item-category:hover {
    color: var(--salmon-pink);
}

.cart-price-box {
    display: flex;
}

.cart-price-type {
    font-size: var(--fs-7);
    font-weight: var(--weight-700);
    color: var(--salmon-pink);
}

.cart-item-price {
    font-size: var(--fs-7);
    font-weight: var(--weight-700);
    color: var(--salmon-pink);
}

.cart-price-box del {
    font-size: var(--fs-9);
    color: var(--sonic-silver);
    margin-left: 10px;
}

/* number button */

.wrapper {
    height: 40px;
    min-width: 110px;
    margin: 10px 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFF;
    border-radius: var(--border-radius-md);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.wrapper-content {
    display: flex;
    gap: 15px;
    /* padding-right: 10px; */
}

.wrapper span {
    width: 100%;
    text-align: center;
    font-size: var(--fs-7);
    font-weight: 600;
    cursor: pointer;
    user-select: none;
}

.wrapper span.num {
    font-size: var(--fs-7);
    border-right: 2px solid rgba(0, 0, 0, 0.2);
    border-left: 2px solid rgba(0, 0, 0, 0.2);
    pointer-events: none;
}

.cart-item-separtor {
    height: 4px;
    width: 100%;
    background: 2px solid rgba(0, 0, 0, 0.2);
    ;
}

/* total */
.total-cart {
    display: flex;
    justify-content: space-between;
    margin: 30px 0;
}


.add-cart-btn {
    background: var(--salmon-pink);
    padding: 8px 15px;
    color: var(--white);
    font-weight: var(--fs-9);
    font-weight: var(--weight-700);
    text-transform: uppercase;
    border-radius: var(--border-radius-md);
    margin-bottom: 15px;
    transition: var(--transition-timing);
}

.proceed-buy-btn {
    position: absolute;
    right: 10px;
}

.cart-box {
    padding-bottom: 50px;
}


.wrapper .form-control {
    width: 30px;
    text-align: center;
    border: none;
}


/* remove btn */

.remove-item-icon {
    margin-left: 10px;
}


.extra-fav-layer{
    display: flex;
    gap: 20px;
}






/* progress bar */

div.spinner {
    position: absolute;
    top: 40%;
    width: 150px;
    height: 150px;
    display: inline-block;
    left: 38%;
    z-index: 50;
}

.spinner.hidden {
    visibility: hidden;
}

div.spinner div {
    width: 6%;
    height: 16%;
    background: black;
    position: absolute;
    left: 49%;
    top: 43%;
    opacity: 0;
    border-radius: 50px;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    animation: fade 1s linear infinite;
}

@-webkit-keyframes fade {
    from {
        opacity: 1;
    }

    to {
        opacity: 0.25;
    }
}

div.spinner div.bar1 {
    -webkit-transform: rotate(0deg) translate(0, -130%);
    -webkit-animation-delay: 0s;
}

div.spinner div.bar2 {
    -webkit-transform: rotate(30deg) translate(0, -130%);
    -webkit-animation-delay: -0.9167s;
}

div.spinner div.bar3 {
    -webkit-transform: rotate(60deg) translate(0, -130%);
    -webkit-animation-delay: -0.833s;
}

div.spinner div.bar4 {
    -webkit-transform: rotate(90deg) translate(0, -130%);
    -webkit-animation-delay: -0.7497s;
}

div.spinner div.bar5 {
    -webkit-transform: rotate(120deg) translate(0, -130%);
    -webkit-animation-delay: -0.667s;
}

div.spinner div.bar6 {
    -webkit-transform: rotate(150deg) translate(0, -130%);
    -webkit-animation-delay: -0.5837s;
}

div.spinner div.bar7 {
    -webkit-transform: rotate(180deg) translate(0, -130%);
    -webkit-animation-delay: -0.5s;
}

div.spinner div.bar8 {
    -webkit-transform: rotate(210deg) translate(0, -130%);
    -webkit-animation-delay: -0.4167s;
}

div.spinner div.bar9 {
    -webkit-transform: rotate(240deg) translate(0, -130%);
    -webkit-animation-delay: -0.333s;
}

div.spinner div.bar10 {
    -webkit-transform: rotate(270deg) translate(0, -130%);
    -webkit-animation-delay: -0.2497s;
}

div.spinner div.bar11 {
    -webkit-transform: rotate(300deg) translate(0, -130%);
    -webkit-animation-delay: -0.167s;
}

div.spinner div.bar12 {
    -webkit-transform: rotate(330deg) translate(0, -130%);
    -webkit-animation-delay: -0.0833s;
}


.quantity-input-field {
    color: red;
}