/**
 * UrbanToes Display MRP Frontend Styles
 * "Was Price" display with badges
 */

/* Price Wrapper */
.ut-price-wrapper {
    margin: 15px 0;
}

/* Price Block */
.ut-price-block {
    background: #fff;
    border: 2px solid #E8E4E8;
    border-radius: 8px;
    padding: 15px;
    position: relative;
}

/* Badge Styles */
.ut-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}

.ut-badge-regular {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: #fff;
}

.ut-badge-flash {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    color: #fff;
    animation: pulse-flash 2s ease-in-out infinite;
}

.ut-badge-clearance {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: #fff;
    animation: pulse-clearance 2s ease-in-out infinite;
}

@keyframes pulse-flash {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); }
    50% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
}

@keyframes pulse-clearance {
    0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.7); }
    50% { box-shadow: 0 0 0 6px rgba(245, 158, 11, 0); }
}

/* Price Row */
.ut-price-row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

/* Was Price (Display MRP) */
.ut-was-price {
    font-size: 14px;
    color: #999;
    text-decoration: line-through;
    font-weight: 400;
}

/* Regular Price (when showing flash/clearance) */
.ut-regular-price {
    font-size: 16px;
    color: #666;
    text-decoration: line-through;
    font-weight: 500;
}

/* Special Price (regular days) */
.ut-special-price {
    font-size: 28px;
    color: #2A242B;
    font-weight: 700;
    text-decoration: none;
}

/* Sale Price (flash sale) */
.ut-sale-price {
    font-size: 28px;
    color: #dc2626;
    font-weight: 700;
    text-decoration: none;
}

/* Clearance Price (last piece) */
.ut-clearance-price {
    font-size: 28px;
    color: #d97706;
    font-weight: 700;
    text-decoration: none;
}

/* Savings Display */
.ut-savings {
    display: inline-block;
    background: #ecfdf5;
    color: #059669;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
}

.ut-flash-savings {
    background: #fef2f2;
    color: #dc2626;
}

.ut-clearance-savings {
    background: #fffbeb;
    color: #d97706;
}

/* Stock Alert */
.ut-stock-alert {
    display: block;
    margin-top: 8px;
    padding: 6px 10px;
    background: #fff7ed;
    border-left: 3px solid #f59e0b;
    color: #92400e;
    font-size: 12px;
    font-weight: 600;
    border-radius: 4px;
}

/* Flash Sale Specific Styling */
.ut-flash-sale {
    border-color: #fca5a5;
    background: linear-gradient(135deg, #fff 0%, #fef2f2 100%);
}

/* Last Piece Specific Styling */
.ut-last-piece {
    border-color: #fcd34d;
    background: linear-gradient(135deg, #fff 0%, #fffbeb 100%);
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .ut-price-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    
    .ut-special-price,
    .ut-sale-price,
    .ut-clearance-price {
        font-size: 24px;
    }
    
    .ut-regular-price {
        font-size: 14px;
    }
}

/* Shop/Archive Page Compact View */
.woocommerce ul.products li.product .ut-price-wrapper {
    margin: 10px 0;
}

.woocommerce ul.products li.product .ut-price-block {
    padding: 10px;
}

.woocommerce ul.products li.product .ut-special-price,
.woocommerce ul.products li.product .ut-sale-price,
.woocommerce ul.products li.product .ut-clearance-price {
    font-size: 16px;
}

.woocommerce ul.products li.product .ut-was-price {
    font-size: 12px;
}

.woocommerce ul.products li.product .ut-regular-price {
    font-size: 14px;
}

.woocommerce ul.products li.product .ut-savings {
    font-size: 11px;
    padding: 3px 8px;
}

.woocommerce ul.products li.product .ut-stock-alert {
    font-size: 11px;
    padding: 4px 8px;
}