/**
 * Design moderne - Remplace border-left et border-radius
 * Effet glow/shadow professionnel
 * Version: 1.0.0
 * Date: 2025-01-28
 */

/* Nouveau design pour les cartes et conteneurs */
.card-modern,
.testimonial-card,
.faq-item,
.trust-badge,
.payment-plan,
.comparison-card,
.quote-line-card {
    /* Suppression des anciennes bordures */
    border-left: none !important;
    border-radius: 12px !important; /* Garde le radius mais pas de différence gauche/droite */
    
    /* Nouveau design : effet glow subtil */
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.15), 
                0 4px 12px rgba(102, 126, 234, 0.1),
                0 2px 4px rgba(0, 0, 0, 0.05) !important;
    border: 1px solid rgba(102, 126, 234, 0.2) !important;
    transition: all 0.3s ease !important;
}

.card-modern:hover,
.testimonial-card:hover,
.payment-plan:hover,
.comparison-card:hover,
.quote-line-card:hover {
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.25), 
                0 8px 20px rgba(102, 126, 234, 0.15),
                0 4px 8px rgba(0, 0, 0, 0.08) !important;
    transform: translateY(-2px) !important;
}

/* Variantes de couleur pour différents contextes */
.card-success {
    box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.15), 
                0 4px 12px rgba(16, 185, 129, 0.1) !important;
    border: 1px solid rgba(16, 185, 129, 0.2) !important;
}

.card-warning {
    box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.15), 
                0 4px 12px rgba(245, 158, 11, 0.1) !important;
    border: 1px solid rgba(245, 158, 11, 0.2) !important;
}

.card-error {
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.15), 
                0 4px 12px rgba(239, 68, 68, 0.1) !important;
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
}

/* Messages et alertes */
.alert,
.message-box,
.notification {
    border-left: none !important;
    border-radius: 12px !important;
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.15), 
                0 4px 12px rgba(102, 126, 234, 0.1) !important;
    border: 1px solid rgba(102, 126, 234, 0.2) !important;
}

.alert-success {
    box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.15), 
                0 4px 12px rgba(16, 185, 129, 0.1) !important;
    border: 1px solid rgba(16, 185, 129, 0.2) !important;
}

.alert-warning,
.urgency-banner {
    box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.15), 
                0 4px 12px rgba(245, 158, 11, 0.1) !important;
    border: 1px solid rgba(245, 158, 11, 0.2) !important;
}

.alert-error {
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.15), 
                0 4px 12px rgba(239, 68, 68, 0.1) !important;
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
}

/* Garantie box */
.guarantee-box {
    border-left: none !important;
    border-radius: 12px !important;
    box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2), 
                0 4px 12px rgba(16, 185, 129, 0.15) !important;
    border: 2px solid rgba(16, 185, 129, 0.3) !important;
}

/* Sections CTA */
.cta-section {
    border-radius: 16px !important;
    box-shadow: 0 8px 24px rgba(102, 126, 234, 0.2),
                0 4px 12px rgba(118, 75, 162, 0.15) !important;
}

/* Dark mode adaptations */
[data-theme="dark"] .card-modern,
[data-theme="dark"] .testimonial-card,
[data-theme="dark"] .faq-item,
[data-theme="dark"] .payment-plan,
[data-theme="dark"] .comparison-card {
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.25), 
                0 4px 12px rgba(102, 126, 234, 0.2),
                0 2px 4px rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(102, 126, 234, 0.3) !important;
}

[data-theme="dark"] .card-modern:hover,
[data-theme="dark"] .testimonial-card:hover,
[data-theme="dark"] .payment-plan:hover,
[data-theme="dark"] .comparison-card:hover {
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.35), 
                0 8px 20px rgba(102, 126, 234, 0.25),
                0 4px 8px rgba(0, 0, 0, 0.4) !important;
}

/* Responsive */
@media (max-width: 768px) {
    .card-modern,
    .testimonial-card,
    .faq-item,
    .payment-plan,
    .comparison-card {
        box-shadow: 0 0 0 1px rgba(102, 126, 234, 0.15), 
                    0 2px 8px rgba(102, 126, 234, 0.1) !important;
    }
}

/* Animation subtile au chargement */
@keyframes fadeInGlow {
    from {
        opacity: 0;
        box-shadow: 0 0 0 0 rgba(102, 126, 234, 0);
    }
    to {
        opacity: 1;
        box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.15), 
                    0 4px 12px rgba(102, 126, 234, 0.1);
    }
}

.card-modern,
.testimonial-card,
.payment-plan,
.comparison-card {
    animation: fadeInGlow 0.4s ease-out;
}