/* --- استایل پایه برای بخش نظرسنجی هوشمند --- */

/* کانتینر اصلی برای ایجاد فاصله و حاشیه */
.smart-riddle-survey-wrapper {
    margin: 30px 0; /* فاصله بالا و پایین */
    padding: 15px; /* کمی کاهش پدینگ برای موبایل */
    background-color: #f9f9f9; /* رنگ پس زمینه ملایم */
    border: 1px solid #e0e0e0; /* حاشیه خاکستری */
    border-radius: 8px; /* گوشه‌های گرد */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); /* سایه ملایم */
    max-width: 100%; /* اطمینان از اینکه از عرض صفحه بیرون نمی‌زند */
    box-sizing: border-box; /* padding و border در عرض کلی محاسبه شوند */
}

/* کانتینر داخلی */
.smart-riddle-survey {
    text-align: center; 
}

/* استایل سوال */
.smart-riddle-survey h4 {
    font-size: 1.1em; 
    color: #333;
    margin-top: 0; /* حذف مارجین بالا اگر پدینگ در wrapper هست */
    margin-bottom: 20px; 
    line-height: 1.5;
    /* مدیریت متن‌های طولانی برای سوال */
    overflow-wrap: break-word;
    word-wrap: break-word; /* برای مرورگرهای قدیمی‌تر */
    word-break: break-word; /* جایگزین دیگر برای شکستن کلمات */
    hyphens: auto; /* (اختیاری) برای شکستن بهتر کلمات در برخی مرورگرها */
}

/* استایل لیست گزینه‌ها */
.smart-riddle-options {
    list-style: none; 
    padding: 0;
    margin: 0;
}

/* استایل هر آیتم لیست */
.smart-riddle-options li {
    margin-bottom: 10px; 
}

/* استایل دکمه‌های گزینه‌ها */
.smart-riddle-option-btn {
    display: block; 
    width: 100%;
    padding: 10px 12px; /* کمی کاهش پدینگ برای موبایل */
    font-size: 0.95em; /* کمی کاهش فونت برای موبایل */
    background-color: #fff;
    color: #0073aa; 
    border: 1px solid #0073aa;
    border-radius: 5px;
    cursor: pointer; 
    transition: background-color 0.2s ease, color 0.2s ease; 
    text-align: center;

    /* مدیریت متن‌های طولانی برای دکمه‌ها */
    white-space: normal; /* اجازه به متن برای رفتن به چند خط */
    line-height: 1.4;    /* تنظیم ارتفاع خط برای متن چند خطی */
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
}

/* استایل دکمه‌ها هنگام هاور (بردن موس روی آن) */
.smart-riddle-option-btn:hover {
    background-color: #0073aa;
    color: #fff;
}

/* استایل دکمه‌ی انتخاب شده */
.smart-riddle-option-btn.selected-option {
    background-color: #4CAF50; 
    color: #fff;
    border-color: #4CAF50;
}

/* استایل دکمه‌های غیرفعال شده */
.smart-riddle-option-btn:disabled {
    background-color: #f0f0f0;
    color: #999;
    border-color: #dcdcdc;
    cursor: not-allowed; 
    opacity: 0.7;
}

/* استایل دکمه‌های غیرفعال (به جز انتخاب شده) */
.smart-riddle-option-btn:disabled:not(.selected-option) {
    opacity: 0.6; 
}

/* استایل پیام تشکر */
.smart-riddle-message {
    padding: 15px;
    margin-top: 15px;
    background-color: #e8f5e9; 
    border: 1px solid #a5d6a7;
    color: #2e7d32; 
    border-radius: 4px;
    text-align: center;
    font-weight: bold;
    overflow-wrap: break-word; /* برای پیام‌های طولانی احتمالی */
    word-wrap: break-word;
    word-break: break-word;
}