/**
 * Vehicle Status Badges CSS
 * Styling for vehicle status badges and indicators
 */

/* Base badge styles */
.vehicle-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-right: 5px;
    margin-bottom: 5px;
    color: #fff;
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease;
}

.vehicle-badge i {
    margin-right: 4px;
}

/* Type badges */
.badge-electric {
    background: linear-gradient(135deg, #00c6ff, #0072ff);
    border: 1px solid #0072ff;
}

.badge-hybrid {
    background: linear-gradient(135deg, #00d084, #0072ff);
    border: 1px solid #00a86b;
}

.badge-gas {
    background: linear-gradient(135deg, #ff7e5f, #feb47b);
    border: 1px solid #ff7e5f;
}

.badge-diesel {
    background: linear-gradient(135deg, #4b6cb7, #182848);
    border: 1px solid #182848;
}

.badge-economy {
    background: linear-gradient(135deg, #56ab2f, #a8e063);
    border: 1px solid #56ab2f;
}

.badge-luxury {
    background: linear-gradient(135deg, #b8a07e, #8e7757);
    border: 1px solid #8e7757;
}

.badge-sports {
    background: linear-gradient(135deg, #ff416c, #ff4b2b);
    border: 1px solid #ff416c;
}

.badge-suv {
    background: linear-gradient(135deg, #6a11cb, #2575fc);
    border: 1px solid #6a11cb;
}

/* Status badges */
.badge-available {
    background: linear-gradient(135deg, #00b09b, #96c93d);
    border: 1px solid #00b09b;
}

.badge-rented {
    background: linear-gradient(135deg, #f5576c, #f093fb);
    border: 1px solid #f5576c;
}

.badge-maintenance {
    background: linear-gradient(135deg, #ffd86f, #fc6262);
    border: 1px solid #fc6262;
}

.badge-reserved {
    background: linear-gradient(135deg, #f7971e, #ffd200);
    border: 1px solid #f7971e;
}

.badge-verified {
    background: linear-gradient(135deg, #00c6ff, #0072ff);
    border: 1px solid #0072ff;
}

.badge-featured {
    background: linear-gradient(135deg, #9733ee, #da22ff);
    border: 1px solid #9733ee;
}

/* Hover effects */
.vehicle-badge:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Badge container */
.vehicle-badges {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

/* Cyberpunk glow effect */
.badge-glow {
    box-shadow: 0 0 10px rgba(var(--badge-glow-color, 0, 198, 255), 0.7);
    animation: badgePulse 2s infinite alternate;
}

@keyframes badgePulse {
    from {
        box-shadow: 0 0 5px rgba(var(--badge-glow-color, 0, 198, 255), 0.5);
    }
    to {
        box-shadow: 0 0 15px rgba(var(--badge-glow-color, 0, 198, 255), 0.8);
    }
}
