/* --- 2. Naya Cart Design CSS (v4.0) --- */
.uvicon-cart-wrapper {
    width: 100%;
    margin: 20px auto;
    padding: 0 10px;
    font-family: 'Montserrat', sans-serif;
    background-color: #EEEEEE;
}
.uvicon-cart-empty-msg {
    text-align: center;
    font-size: 18px;
    color: #777;
    padding: 50px 0;
}

/* --- Desktop 5-Column Header --- */
.uvicon-cart-header {
    display: flex;
    padding: 15px 0;
    border-bottom: 1px solid #eee;
    font-weight: 600;
    color: #888;
    font-size: 14px;
    text-transform: uppercase;
    gap: 15px;
}
.uvicon-cart-header-product {
    flex: 3;
    padding-left: 10px;
}
.uvicon-cart-header-price {
    flex: 2;
    text-align: left;
}
.uvicon-cart-header-validity {
    flex: 1.5;
    text-align: left;
} /* Naya */
.uvicon-cart-header-quantity {
    flex: 1;
    text-align: center;
}
.uvicon-cart-header-total {
    flex: 1;
    text-align: right;
    padding-right: 10px;
}

/* --- Cart Items List --- */
.uvicon-cart-items-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.uvicon-cart-item {
    display: flex;
    align-items: center;
    padding: 20px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 15px;
    gap: 15px;
}
.uvicon-cart-item:last-child {
    border-bottom: none;
}
.uvicon-cart-item.processing {
    opacity: 0.6;
    pointer-events: none;
}

/* --- Desktop 5 Columns --- */
.uvicon-item-col { /* common */
}

/* 1. Product Column */
.uvicon-item-product-col {
    flex: 3;
    display: flex;
    align-items: center;
    padding-left: 10px;
}
.uvicon-product-image {
    width: 70px;
    height: 70px;
    object-fit: cover;
    border-radius: 8px;
    margin-right: 15px;
    border: 1px solid #eee;
}
.uvicon-product-details {
    display: flex;
    flex-direction: column;
}
.uvicon-product-name {
    font-weight: 600;
    color: #333;
    margin-bottom: 2px;
}
.uvicon-product-group {
    font-size: 13px;
    color: #888;
    text-transform: uppercase;
    font-weight: 500;
}

/* --- YAHAN BADLAAV KIYA GAYA HAI --- */
/* Desktop ke liye naya remove link */
.uvicon-remove-desktop {
    font-size: 13px;
    color: #e74c3c;
    cursor: pointer;
    margin-top: 5px;
    font-weight: 500;
    transition: color 0.2s;
    display: inline-block; /* Taaki dikhe */
}
.uvicon-remove-desktop:hover {
    color: #c0392b;
}
/* --- END BADLAAV --- */


/* 2. *** Naya Price Column Layout *** */
.uvicon-item-price-col {
    flex: 2;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}
.uvicon-price-wrapper {
    display: flex;
    flex-direction: column;
}
.uvicon-price-current-list {
    font-size: 16px;
    font-weight: 600;
    color: #333;
}
.uvicon-price-original-list {
    font-size: 13px;
    color: #999;
    text-decoration: line-through;
}
.uvicon-price-discount-badge {
    font-size: 11px;
    font-weight: 700;
    background: #e44d26;
    color: #fff;
    padding: 2px 6px;
    border-radius: 4px;
    align-self: center; /* Bagal mein center */
}

/* 3. Validity Column */
.uvicon-item-validity-col {
    flex: 1.5;
    text-align: left;
    font-size: 14px;
    color: #555;
    font-weight: 500;
}

/* 4. Quantity Column */
.uvicon-item-quantity-col {
    flex: 1;
    text-align: center;
}
.uvicon-quantity-controls {
    display: inline-flex;
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 20px;
    overflow: hidden;
}
.uvicon-quantity-btn {
    background-color: #f7f7f7;
    border: none;
    padding: 8px 12px;
    cursor: pointer;
    font-size: 16px;
    color: #555;
    transition: background-color 0.2s;
}
.uvicon-quantity-btn:hover {
    background-color: #eee;
}
.uvicon-quantity-display {
    padding: 8px 15px;
    font-size: 16px;
    font-weight: 600;
    color: #333;
    min-width: 30px;
    text-align: center;
}

/* 5. Total Column */
.uvicon-item-total-col {
    flex: 1;
    text-align: right;
    font-weight: 600;
    color: #003D3F;
    font-size: 16px;
    padding-right: 10px;
}

/* 6. Mobile Remove Column (Desktop par Chhupa hua) */
.uvicon-item-remove-col {
    display: none;
}

/* --- Cart Footer (Summary + Actions) --- */
.uvicon-cart-footer-wrapper {
    display: flex;
    flex-wrap: wrap; 
    justify-content: space-between; 
    border-top: 1px solid #eee;
    padding-top: 20px;
    margin-top: 30px;
}
.uvicon-cart-summary,
.uvicon-cart-actions {
    flex-basis: 48%; 
    max-width: 450px; 
}
.uvicon-cart-summary {
    /* Left aligned (default) */
}
.uvicon-cart-actions {
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: flex-start; /* Left align */
}
.uvicon-coupon-area {
    width: 100%;
}
.uvicon-coupon-input-box {
    display: none; 
    display: flex;
    gap: 10px;
    margin-top: 10px;
}
#uvicon-coupon-input {
    flex-grow: 1;
    border: 1px solid #ddd;
    padding: 10px 15px;
    border-radius: 30px;
    font-size: 14px;
}
.uvicon-btn.uvicon-btn-apply {
    padding: 10px 20px;
    background-color: #555;
}
.uvicon-btn.uvicon-btn-primary {
    align-self: stretch; 
}

/* --- Cart Summary Rows --- */
.uvicon-summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    font-size: 16px;
    color: #555;
}
.uvicon-summary-row span:last-child {
    font-weight: 600;
}
.uvicon-summary-row.uvicon-grand-total {
    font-size: 20px;
    font-weight: 700;
    color: #003D3F;
    margin-top: 15px;
    padding-top: 10px;
    border-top: 1px solid #f0f0f0;
}

.uvicon-btn {
    padding: 12px 25px;
    border: none;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.uvicon-btn-secondary {
    background-color: #FFF;
    color: #555;
}
.uvicon-btn-secondary:hover {
    background-color: #e0e0e0;
}
.uvicon-btn-primary {
    background-color: #003D3F;
    color: #fff;
}
.uvicon-btn-primary:hover {
    background-color: #008080;
}

/* --- Responsive Design (Naya Mobile View) --- */
@media (max-width: 768px) {
    .uvicon-cart-header {
        display: none;
    } 
    
    .uvicon-cart-item {
        flex-wrap: wrap; 
        gap: 10px; 
        padding: 15px 5px; 
    }
    
    /* 1. Product (Top Full Width) */
    .uvicon-item-product-col {
        flex-basis: 100%;
        padding-left: 0;
        order: 1; 
    }
    .uvicon-product-image {
        width: 60px;
        height: 60px;
    }

    /* 2. Price (Left) */
    .uvicon-item-price-col {
        flex-basis: calc(50% - 10px);
        order: 2; 
        padding: 5px 0;
    }
    
    /* 3. Validity (Right, "bagal me") */
    .uvicon-item-validity-col {
        flex-basis: calc(50% - 10px);
        order: 3; 
        text-align: right;
        align-self: center;
        font-weight: 500;
        color: #333;
        font-size: 14px;
    }
    
    /* 4. Quantity (Bottom Left) */
    .uvicon-item-quantity-col {
        flex-basis: calc(50% - 10px); 
        order: 4; 
        text-align: left;
    }
    .uvicon-quantity-controls {
        margin: 0;
    } 

    /* 5. Total (Bottom Right) */
    .uvicon-item-total-col {
        flex-basis: calc(50% - 10px); 
        order: 5; 
        text-align: right;
        font-size: 18px;
        align-self: center; 
    }
    
    /* --- YAHAN BADLAAV KIYA GAYA HAI --- */
    /* Desktop remove link ko mobile par hide karein */
    .uvicon-remove-desktop {
        display: none;
    }
    
    /* 6. Mobile Remove Button (Naya, Mobile ke liye) */
    .uvicon-item-remove-col {
        display: block; /* Sirf mobile par dikhayein */
        flex-basis: 100%;
        order: 6; /* Sabse neeche */
        text-align: center;
        border-top: 1px solid #D8D8D8;
        padding-top: 15px;
        margin-top: 10px;
    }
    /* --- END BADLAAV --- */
    
    .uvicon-quantity-remove {
        font-size: 14px;
        font-weight: 600;
        color: #e74c3c;
        cursor: pointer;
        letter-spacing: 1px;
    }
    .uvicon-quantity-remove:hover {
        color: #c0392b;
    }

    /* Summary aur Actions */
    .uvicon-cart-footer-wrapper {
        flex-direction: column; /* Stack karein */
        gap: 30px;
    }
    .uvicon-cart-summary,
    .uvicon-cart-actions {
        flex-basis: 100%; /* Full width */
        max-width: none;
    }
    .uvicon-cart-actions {
        align-items: stretch;
    }
    .uvicon-btn {
        width: 100%;
    }
}