/**
 * CSS for FAQ Shortcode
 * File: css/faq-style.css
 */

 .faq-container { /* Main container for all FAQ content */
    margin: 20px 0; /* Centering and vertical margin */
    padding: 0; /* Padding for smaller screens */
}

.faq-group {
    margin-bottom: 40px; /* Space between FAQ groups */
}

.faq-group:last-child {
    margin-bottom: 0;
}

.faq-group-title {
    font-size: 1.8em; /* Adjust as needed */
    margin-top: 0;
    margin-bottom: 10px; /* Space after group title */
    padding-bottom: 5px;
    /* border-bottom: 2px solid #3498db; */ /* Optional accent border */
}

.faq-group-description {
    font-size: 1em;
    margin-bottom: 25px; /* Space after group description and before items wrapper */
    line-height: 1.6;
}

.faq-items-wrapper {
    /* Styles for the wrapper of all items in a group */
    background-color: #f8f9fa; /* Light grey background */
    border: 1px solid #e9ecef; /* Soft border */
    border-radius: 8px;        /* Rounded corners for the wrapper */
    padding: 20px;             /* Padding inside the wrapper */
}

.faq-item {
    /* Styles for each individual Q&A item */
    background-color: #ffffff; /* White background for each item */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); /* Subtle shadow */
    border-radius: 8px;        /* Rounded corners for each item */
    padding: 15px 20px;        /* Inner padding for each Q&A item */
    margin-bottom: 15px;       /* Space between Q&A items within the wrapper */
}

.faq-items-wrapper .faq-item:last-child {
    margin-bottom: 0; /* No bottom margin for the last item inside the wrapper */
}

.faq-question-text { /* Styling for the question text */
    font-size: 1.15em; /* Slightly larger question text */
    font-weight: 600;  /* Bold questions */
    margin-bottom: 12px; /* Increased space between question and answer */
    line-height: 1.4;
}

.faq-answer {
    /* No specific styles needed for the answer container itself */
}

.faq-answer-content {
    font-size: 1em;
    line-height: 1.65; /* Slightly more line height for readability */
}

/* Ensure paragraphs within the answer content are styled nicely */
.faq-answer-content p {
    margin-top: 0;
    margin-bottom: 1em; /* Space between paragraphs in an answer */
}

.faq-answer-content p:last-child {
    margin-bottom: 0;
}

/* Media Queries */
@media (max-width: 767px) { /* Target screens below 768px */
    .faq-container {
        padding: 0; /* Remove horizontal padding */
    }

    .faq-group-title {
        font-size: 1.6em; /* Slightly smaller group title on mobile */
    }

    .faq-question-text {
        font-size: 1.05em; /* Slightly smaller question text on mobile */
    }

    .faq-items-wrapper {
        padding: 15px; /* Reduce padding inside the wrapper on mobile */
    }

    .faq-item {
        padding: 15px; /* Reduce padding inside individual items on mobile */
    }
}