/**
 * Design moderne - Cartes et conteneurs
 * Ombres neutres, zero couleur violet/indigo
 * Version: 2.0.0
 */

/* 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;

    /* Ombres neutres */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06),
                0 2px 4px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid var(--border-color, #e5e7eb) !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 4px 12px rgba(0, 0, 0, 0.1),
                0 2px 4px rgba(0, 0, 0, 0.06) !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 1px 3px rgba(0, 0, 0, 0.06),
                0 2px 4px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid var(--border-color, #e5e7eb) !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 4px 12px rgba(0, 0, 0, 0.08),
                0 2px 4px rgba(0, 0, 0, 0.04) !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 1px 3px rgba(0, 0, 0, 0.2),
                0 2px 4px rgba(0, 0, 0, 0.15) !important;
    border: 1px solid var(--border-color, #4a4a5e) !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 4px 12px rgba(0, 0, 0, 0.3),
                0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

/* Responsive */
@media (max-width: 768px) {
    .card-modern,
    .testimonial-card,
    .faq-item,
    .payment-plan,
    .comparison-card {
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06),
                    0 1px 3px rgba(0, 0, 0, 0.04) !important;
    }
}