/* FAQ Fix Styles - Override any conflicting styles */

/* Force FAQ items to have proper styling */
.faq-item.elegant {
    background: white !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.03) !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    margin-bottom: 1.5rem !important;
    display: block !important;
}

/* Style the question area */
.faq-item.elegant .faq-question {
    padding: 1.5rem 2rem !important;
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
    cursor: pointer !important;
    position: relative !important;
    background: linear-gradient(135deg, #ffffff 0%, #f8faff 100%) !important;
}

/* Style the answer area - hidden by default */
.faq-item.elegant .faq-answer {
    display: none !important;
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    transition: all 0.3s ease !important;
    padding: 0 !important;
}

/* Style the answer area when active */
.faq-item.elegant.active .faq-answer {
    display: block !important;
    max-height: 1000px !important;
    opacity: 1 !important;
    padding: 1.5rem 2rem 1.5rem 5.5rem !important;
    overflow: visible !important;
}

/* Style the question icon */
.faq-item.elegant .question-icon {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    background: linear-gradient(135deg, rgba(0, 120, 227, 0.1) 0%, rgba(0, 120, 227, 0.05) 100%) !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #0078e3 !important;
    font-size: 1rem !important;
}

/* Style the toggle icon */
.faq-item.elegant .toggle-icon {
    color: #0078e3 !important;
    transition: all 0.3s ease !important;
    font-size: 0.9rem !important;
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Rotate toggle icon when active */
.faq-item.elegant.active .toggle-icon i {
    transform: rotate(180deg) !important;
}

/* Style the question heading */
.faq-item.elegant .faq-question h3 {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    margin: 0 !important;
    flex-grow: 1 !important;
    line-height: 1.4 !important;
}

/* Style the answer paragraph */
.faq-item.elegant .faq-answer p {
    color: #64748b !important;
    line-height: 1.7 !important;
    font-size: 1rem !important;
    margin: 0 !important;
}