/* static/css/payment-workflow.css */

/* Styles pour les notifications */
@keyframes slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.payment-notification {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Styles pour les options de paiement */
.payment-option {
    border: 2px solid #e9ecef !important;
    transition: all 0.3s ease;
}

.payment-option:hover {
    border-color: #007bff !important;
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.15);
    transform: translateY(-2px);
}

.payment-option.selected {
    border-color: #28a745 !important;
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.25);
    background-color: #f8fff9;
}

.payment-method-card {
    position: relative;
}

.selection-indicator {
    pointer-events: none;
}

.card-logos .badge {
    font-size: 0.7rem;
    padding: 0.25rem 0.5rem;
}

.badge-outline-secondary {
    color: #6c757d;
    border: 1px solid #6c757d;
    background-color: transparent;
}

.wallet-balance {
    border: 1px solid #dee2e6;
}

.payment-features small {
    font-size: 0.85rem;
}

/* Animation pour l'indicateur de sélection */
.selection-indicator.show {
    animation: checkIn 0.3s ease-in-out;
}

@keyframes checkIn {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* États désactivés */
.payment-option.disabled {
    opacity: 0.6;
    cursor: not-allowed !important;
    background-color: #f8f9fa;
}

.payment-option.disabled:hover {
    border-color: #e9ecef !important;
    box-shadow: none;
    transform: none;
}