body {
    font-family: 'Segoe UI', sans-serif;
}

.upload-box {
    border: 2px dashed #0d6efd;
    padding: 25px;
    border-radius: 10px;
    text-align: center;
    background: #f8f9fa;
}

.upload-box:hover {
    background: #eef5ff;
    border-color: #0a58ca;
}

/* Modified CSS for Visible Skill Badges */
.skill-badge {
    /* 1. Background Color: Use a distinct, vibrant color (e.g., a pleasant blue) */
    background-color: #4A90E2; 
    
    /* 2. Text Color: Ensure the text is white or very light for contrast */
    color: #ffffff; 
    
    /* Remaining modern styles */
    padding: 0.75rem 1.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    border-radius: 50px; /* Pill-shaped */
    border: none; /* Removed border */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
    transition: all 0.2s ease; 
}

/* Optional: Add a lift on hover */
.skill-badge:hover {
    background-color: #357ABD; /* Slightly darker on hover */
    transform: translateY(-1px);
    cursor: default;
}