/* 
 * Portale del Candidato - Brand Colors Standard
 * Colori ufficiali del brand da utilizzare in tutto il sito
 */

:root {
    /* Colori Brand Standard */
    --brand-dark-blue: #171D33;
    --brand-red-start: #F15B50;
    --brand-red-end: #F79925;
    --brand-green-start: #46CF74;
    --brand-green-end: #016934;
    --brand-cyan-start: #52EFFF;
    --brand-cyan-end: #498FFD;
}

/* === PULSANTI PRIMARI === */

/* Pulsante Esporta - Gradiente Rosso */
.btn-export {
    background: linear-gradient(135deg, var(--brand-red-start) 0%, var(--brand-red-end) 100%);
    border: none;
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-export:hover {
    background: linear-gradient(135deg, #e64e43 0%, #e88817 100%);
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(241, 91, 80, 0.3);
}

/* Pulsante Aggiungi - Gradiente Azzurro */
.btn-add, .btn-add-candidate {
    background: linear-gradient(135deg, var(--brand-cyan-start) 0%, var(--brand-cyan-end) 100%);
    border: none;
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-add:hover, .btn-add-candidate:hover {
    background: linear-gradient(135deg, #3de6ff 0%, #3680fc 100%);
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(82, 239, 255, 0.3);
}

/* Pulsante Salva/Conferma - Gradiente Verde */
.btn-save, .btn-save-candidate, .btn-confirm {
    background: linear-gradient(135deg, var(--brand-green-start) 0%, var(--brand-green-end) 100%);
    border: none;
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-save:hover, .btn-save-candidate:hover, .btn-confirm:hover {
    background: linear-gradient(135deg, #3bb965 0%, #015529 100%);
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(70, 207, 116, 0.3);
}

/* Pulsante Standard/Neutro - Blu Scuro */
.btn-standard, .btn-neutral {
    background-color: var(--brand-dark-blue);
    border-color: var(--brand-dark-blue);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-standard:hover, .btn-neutral:hover {
    background-color: #0f1419;
    border-color: #0f1419;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(23, 29, 51, 0.3);
}

/* === PULSANTI OUTLINE === */

/* Outline Azzurro */
.btn-outline-cyan {
    border-color: var(--brand-cyan-start);
    color: var(--brand-cyan-start);
    background: transparent;
}

.btn-outline-cyan:hover {
    background: linear-gradient(135deg, var(--brand-cyan-start) 0%, var(--brand-cyan-end) 100%);
    border-color: var(--brand-cyan-start);
    color: white;
}

/* Outline Verde */
.btn-outline-green {
    border-color: var(--brand-green-start);
    color: var(--brand-green-start);
    background: transparent;
}

.btn-outline-green:hover {
    background: linear-gradient(135deg, var(--brand-green-start) 0%, var(--brand-green-end) 100%);
    border-color: var(--brand-green-start);
    color: white;
}

/* Outline Rosso */
.btn-outline-red {
    border-color: var(--brand-red-start);
    color: var(--brand-red-start);
    background: transparent;
}

.btn-outline-red:hover {
    background: linear-gradient(135deg, var(--brand-red-start) 0%, var(--brand-red-end) 100%);
    border-color: var(--brand-red-start);
    color: white;
}

/* Outline Blu Scuro */
.btn-outline-dark {
    border-color: var(--brand-dark-blue);
    color: var(--brand-dark-blue);
    background: transparent;
}

.btn-outline-dark:hover {
    background-color: var(--brand-dark-blue);
    border-color: var(--brand-dark-blue);
    color: white;
}

/* === OVERRIDE BOOTSTRAP === */

/* Sovrascrive i colori Bootstrap standard per allinearli al brand */
.btn-primary {
    background: linear-gradient(135deg, var(--brand-cyan-start) 0%, var(--brand-cyan-end) 100%);
    border: none;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #3de6ff 0%, #3680fc 100%);
    border: none;
}

.btn-success {
    background: linear-gradient(135deg, var(--brand-green-start) 0%, var(--brand-green-end) 100%);
    border: none;
}

.btn-success:hover {
    background: linear-gradient(135deg, #3bb965 0%, #015529 100%);
    border: none;
}

.btn-danger {
    background: linear-gradient(135deg, var(--brand-red-start) 0%, var(--brand-red-end) 100%);
    border: none;
}

.btn-danger:hover {
    background: linear-gradient(135deg, #e64e43 0%, #e88817 100%);
    border: none;
}

/* === UTILITY CLASSES === */

/* Colori di testo */
.text-brand-dark { color: var(--brand-dark-blue) !important; }
.text-brand-red { color: var(--brand-red-start) !important; }
.text-brand-green { color: var(--brand-green-start) !important; }
.text-brand-cyan { color: var(--brand-cyan-start) !important; }

/* Colori di sfondo */
.bg-brand-dark { background-color: var(--brand-dark-blue) !important; }
.bg-brand-red { background: linear-gradient(135deg, var(--brand-red-start) 0%, var(--brand-red-end) 100%) !important; }
.bg-brand-green { background: linear-gradient(135deg, var(--brand-green-start) 0%, var(--brand-green-end) 100%) !important; }
.bg-brand-cyan { background: linear-gradient(135deg, var(--brand-cyan-start) 0%, var(--brand-cyan-end) 100%) !important; }

/* Bordi */
.border-brand-dark { border-color: var(--brand-dark-blue) !important; }
.border-brand-red { border-color: var(--brand-red-start) !important; }
.border-brand-green { border-color: var(--brand-green-start) !important; }
.border-brand-cyan { border-color: var(--brand-cyan-start) !important; }

/* === VARIANTI DIMENSIONI === */

.btn-large {
    padding: 1rem 2rem;
    font-size: 1.1rem;
    border-radius: 10px;
}

.btn-small {
    padding: 0.25rem 0.75rem;
    font-size: 0.875rem;
    border-radius: 6px;
}

.btn-icon-normal {
    font-size: 1rem !important;
    vertical-align: middle;
}

/* === STATI SPECIALI === */

/* Pulsanti disabilitati */
.btn:disabled,
.btn.disabled {
    opacity: 0.6;
    transform: none !important;
    box-shadow: none !important;
    cursor: not-allowed;
}

/* Focus accessibile */
.btn:focus {
    outline: 2px solid var(--brand-cyan-start);
    outline-offset: 2px;
}

/* === MEGA BUTTON === */

.mega-add-button {
    background: linear-gradient(135deg, var(--brand-cyan-start) 0%, var(--brand-cyan-end) 100%);
    border: none;
    color: white;
    padding: 1.25rem 2.5rem;
    font-size: 1.1rem;
    border-radius: 12px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 12px rgba(82, 239, 255, 0.2);
    transition: all 0.3s ease;
    cursor: pointer;
}

.mega-add-button:hover {
    background: linear-gradient(135deg, #3de6ff 0%, #3680fc 100%);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(82, 239, 255, 0.3);
}

.mega-add-button:focus {
    outline: 2px solid var(--brand-cyan-start);
    outline-offset: 2px;
}

/* === RESPONSIVE === */

@media (max-width: 768px) {
    .btn-large {
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
    }
    
    .btn {
        padding: 0.4rem 0.8rem;
        font-size: 0.9rem;
    }
    
    .mega-add-button {
        padding: 1rem 2rem;
        font-size: 1rem;
    }
}