.elementor-4831 .elementor-element.elementor-element-a213cf0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4831 .elementor-element.elementor-element-ba97c25{--display:flex;}#elementor-popup-modal-4831{background-color:rgba(0,0,0,.8);justify-content:flex-end;align-items:center;pointer-events:all;}#elementor-popup-modal-4831 .dialog-message{width:335px;height:100vh;align-items:center;}#elementor-popup-modal-4831 .dialog-close-button{display:flex;}#elementor-popup-modal-4831 .dialog-widget-content{box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}@media(max-width:1024px){#elementor-popup-modal-4831 .dialog-message{width:302px;}}/* Start custom CSS for shortcode, class: .elementor-element-17f30d9 *//*
 * File: qa-styles.css
 * Description: Styles for the custom QA system.
 * Version: 1.3
 */

/* General container styles */
.custom-qa-container {
    font-family: inherit;
    direction: rtl;
    text-align: right;
    margin-top: 12px;
}



.qa-main-title {
	display:none !important;
}

/* Question and Answer item styles */
.qa-item {
    border: 1px solid #DEDFE1 ;
    border-radius: 0px;
    background-color: #f2f4f7;

    margin-bottom: 12px;
    overflow: hidden;
}

.qa-question-box,
.qa-answer-box {
    padding: 15px 20px;
    border-bottom: 1px solid #DEDFE1;
    background-color: #f9fbff;
}

.qa-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;

}

.qa-user-name {
    font-weight: bold;
    color: #2c3e50;
}

.qa-date {
    font-size: 12px;
    color: #95a5a6;
}

.qa-content p {
    margin: 0;
    color: #34495e;
    line-height: 1.6;
}

.qa-actions {
    margin-top: 10px;
    display: flex;
    align-items: center;
}

.qa-actions button,
.qa-reply-link {
    background: none;
    border: none;
    cursor: pointer;
    color: #7f8c8d;
    font-size: 14px;
    display: flex;
    align-items: center;
    margin-left: 15px;
    text-decoration: none;
    transition: color 0.2s ease;
}

.qa-actions button:hover,
.qa-reply-link:hover {
    color: #3498db;
}

.qa-actions .dashicons {
    font-size: 16px;
    margin-left: 5px;
}

/* Dynamic rating button styles */
.qa-like-button.active-like {
    color: #e74c3c;
}

.qa-dislike-button.active-dislike {
    color: #34495e;
}

/* Answers section */
.qa-answers {
    background-color: #fff;
    padding: 10px 20px;
}

.qa-form-fields-grid{
    margin-bottom: 4px;
}

.qa-toggle-answers {
    background: none;
    border: none;
    cursor: pointer;
    font-weight: bold;
    color: #3498db;
    display: flex;
    align-items: center;
    width: 100%;
    text-align: right;
    padding: 5px 0;
}

.qa-toggle-answers .dashicons {
    margin-right: 5px;
    transition: transform 0.2s ease;
}

.qa-toggle-answers.active .dashicons {
    transform: rotate(180deg);
}
.qa-toggle-answers:hover{
    background-color: #efefef;
    color: #000;
}

.qa-answers-list {
    margin-top: 10px;
    border-top: 1px dashed #ecf0f1;
    padding-top: 10px;
}

textarea {
    background-color: #fff !important;
    max-height: 100px !important;
}
.qa-answer-box {
    background-color: #fff;
    border-radius: 0px;
    box-shadow: none;
    border: 1px solid #DEDFE1;
    margin-bottom: 10px;
    padding: 10px;
}
.qa-answer-form{
    padding: 16px 18px;
}

/* Form styles */
.custom-qa-form {
    background-color: #fff;
    padding: 4px;
    border-radius: 0px;
    margin-top: 0;
    margin-bottom: 0px;
}

.qa-answer-form h3{
    font-size: 16px;
}
.custom-qa-form h3 {
    margin-top: 0;
    color: #333;
    font-size: 16px;
}

#qa_question_content,
label[for="qa_question_content"] {
    display: none !important;
}
.custom-qa-form label {
        display: block;
        font-weight: bold;
        margin-bottom: 6px;
        color: #555;
    
}

.custom-qa-form label span {
    color: red;
}

.custom-qa-form input[type="text"],
.custom-qa-form textarea,
.custom-qa-form select {
    width: 100%;
    padding: 10px;
    background-color: #fff;
    margin-bottom: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    transition: border-color 0.2s ease;
}

.custom-qa-form input[type="text"]:focus,
.custom-qa-form textarea:focus,
.custom-qa-form select:focus {
    color: #fff;
    border-color: #DEDFE1;
    outline: none;
}

.qa-submit-button {
    background-color: #005C8A !important;
    color: #fff !important;
    width: 100%;
    padding: 12px 20px;
    border: none;
    border-radius:0px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.2s ease;
}

.qa-submit-button:hover {
    background-color: #02577f;
}

.qa-form-message {
    margin-top: 10px;
    padding: 10px;
    border-radius: 4px;
}

.qa-form-message.success {
    background-color: #d4edda;
    color: #155724;
}

.qa-form-message.error {
    background-color: #f8d7da;
    color: #721c24;
}

/* Optimized styles for form field layout */
.qa-form-fields-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-start; /* Align fields to the top of the row */
}

.qa-form-field {
    box-sizing: border-box;
    /* The width (flex-basis) is set by the PHP code, e.g., flex-basis: 50% */
}

/* On screens smaller than 768px, force all fields to stack vertically */
@media (max-width: 767px) {
    .qa-form-fields-grid {
        gap: 0;
    }
    .qa-form-field {
        flex-basis: 100% !important;
        margin-bottom: 15px; /* Add spacing between stacked fields */
    }
    .qa-question-box,
.qa-answer-box {
    padding: 8px 12px;
 
}
}/* End custom CSS */