/**
 * Stili CSS per il campo CF7 um-cv
 * 
 * Stilizza il campo CV con scelta tra profilo e upload
 * in modo user-friendly e responsive
 * 
 * @since 2025-01-14
 */

/* Container principale del campo CV */
.cf7-um-cv-wrapper {
    margin: 15px 0;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #fafafa;
}

/* Header del campo CV */
.cf7-um-cv-header {
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 16px;
}

.cf7-um-cv-header .required {
    color: #d63638;
    font-weight: bold;
}

/* Container delle opzioni radio */
.cf7-um-cv-choices {
    margin: 10px 0;
}

/* Singola opzione radio */
.cf7-um-cv-choice-option {
    display: block;
    margin: 8px 0;
    padding: 10px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.cf7-um-cv-choice-option:hover {
    background-color: #f0f0f1;
    border-color: #999;
}

.cf7-um-cv-choice-option input[type="radio"] {
    margin-right: 8px;
}

.cf7-um-cv-choice-option input[type="radio"]:checked + span,
.cf7-um-cv-choice-option:has(input[type="radio"]:checked) {
    background-color: #e7f3ff;
    border-color: #007cba;
    font-weight: 500;
}

/* Informazioni sul file esistente */
.cf7-um-cv-choice-option em {
    color: #666;
    font-size: 14px;
}

/* Sezione upload */
.cf7-um-cv-upload-section {
    padding: 15px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-top: 10px;
}

.cf7-um-cv-upload-section label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
}

.cf7-um-cv-upload-section input[type="file"] {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
    background-color: #fff;
}

/* Campo standalone (quando non c'è CV nel profilo) */
.cf7-um-cv-standalone {
    margin: 15px 0;
}

.cf7-um-cv-standalone label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
}

.cf7-um-cv-standalone .required {
    color: #d63638;
    font-weight: bold;
}

.cf7-um-cv-standalone input[type="file"] {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
    background-color: #fff;
}

/* Responsive design */
@media (max-width: 768px) {
    .cf7-um-cv-wrapper {
        padding: 10px;
        margin: 10px 0;
    }
    
    .cf7-um-cv-choice-option {
        padding: 8px;
        font-size: 14px;
    }
    
    .cf7-um-cv-upload-section {
        padding: 10px;
    }
}

/* Stato di errore CF7 */
.wpcf7-not-valid .cf7-um-cv-wrapper {
    border-color: #d63638;
    background-color: #fcf2f2;
}

.wpcf7-not-valid .cf7-um-cv-choice-option {
    border-color: #d63638;
}

/* Stato di focus */
.cf7-um-cv-choice-option:focus-within {
    outline: 2px solid #007cba;
    outline-offset: 2px;
}

.cf7-um-cv-upload-section input[type="file"]:focus {
    outline: 2px solid #007cba;
    outline-offset: 2px;
    border-color: #007cba;
}

/* Icone informative (opzionale) */
.cf7-um-cv-choice-option::before {
    content: "📄";
    margin-right: 5px;
}

.cf7-um-cv-choice-option:first-child::before {
    content: "✅";
}

.cf7-um-cv-choice-option:last-child::before {
    content: "📁";
}

/* Animazioni */
.cf7-um-cv-upload-section {
    transition: all 0.3s ease;
}

.cf7-um-cv-choice-option {
    transition: all 0.2s ease;
}

/* Stato hover migliorato */
.cf7-um-cv-choice-option:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}