/* ==================================================
  STC Global Fluent Forms Override
  هماهنگ‌سازی فرم‌ساز با پالت رنگی Tailwind
==================================================
*/

/* استایل فیلدهای ورودی (متن، ایمیل، موبایل و تکست‌اریا) */
.fluentform .ff-el-form-control {
    width: 100% !important;
    background-color: #F9FAFB !important; /* معادل bg-neutral-50 */
    border: 1px solid #E5E7EB !important; /* معادل border-neutral-200 */
    border-radius: 12px !important; /* معادل rounded-xl */
    padding: 12px 16px !important; /* معادل px-4 py-3 */
    font-size: 14px !important; 
    transition: all 0.3s ease !important;
    font-family: inherit !important;
    box-shadow: none !important;
    color: #0A192F !important;
}

/* افکت فوکوس (وقتی کاربر روی فیلد کلیک می‌کند) */
.fluentform .ff-el-form-control:focus {
    outline: none !important;
    border-color: #C5A059 !important; /* طلایی سازمانی */
    box-shadow: 0 0 0 1px #C5A059 !important; 
    background-color: #ffffff !important;
}

/* استایل دکمه ارسال پیام */
.fluentform .ff-btn-submit {
    width: 100% !important;
    background-color: #C5A059 !important; /* bg-gold-500 */
    color: #ffffff !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 14px 24px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    transition: all 0.3s ease !important;
    font-family: inherit !important;
    text-shadow: none !important;
    cursor: pointer !important;
}

/* افکت هاور دکمه ارسال */
.fluentform .ff-btn-submit:hover {
    background-color: #B5904D !important; /* bg-gold-600 */
    box-shadow: 0 4px 12px rgba(10, 25, 47, 0.08) !important;
}

/* استایل برچسب‌ها (Labels) */
.fluentform .ff-el-input--label {
    color: #0A192F !important; /* متن سرمه‌ای */
    font-weight: bold !important;
    margin-bottom: 8px !important;
    font-size: 14px !important;
}

/* پیام‌های خطا (Validation Errors) */
.fluentform .text-danger {
    color: #E74C3C !important;
    font-size: 12px !important;
    margin-top: 4px !important;
    font-weight: bold !important;
}

/* ==================================================
  پیام‌های بازخورد (نسخه ضدگلوله با اولویت بالا)
================================================== */

/* پیام ارسال موفقیت‌آمیز */
body .ff-message-success,
body .fluentform .ff-message-success {
    background-color: #F0FDF4 !important;
    border: 1px solid #BBF7D0 !important;
    color: #166534 !important;
    border-radius: 12px !important;
    padding: 20px !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-align: center !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important;
    margin-top: 10px !important;
    display: block !important;
}

/* پیام خطای کلی فرم */
body .ff-errors-in-form,
body .fluentform .ff-errors-in-form {
    background-color: #FEF2F2 !important;
    border: 1px solid #FECACA !important;
    color: #991B1B !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-align: center !important;
    margin-bottom: 20px !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important;
    display: block !important;
}

/* رفع حاشیه‌های اضافی در حالت‌های لودینگ و مخفی‌سازی فیلدها */
.fluentform form.ff-form-loading {
    opacity: 0.5 !important;
    pointer-events: none !important;
}

/* ==========================================
   ۱. استایل‌های خبرنامه فوتر (حالت تاریک و افقی)
========================================== */
.stc-fluent-newsletter .fluentform { width: 100%; }

/* چیدمان پایه (موبایل) */
.stc-fluent-newsletter .frm-fluent-form { 
    display: flex; 
    flex-direction: column; 
}

/* 📱 حل مشکل چسبیدن فیلدها در موبایل */
.stc-fluent-newsletter .ff-t-cell,
.stc-fluent-newsletter .ff-el-group { 
    margin-bottom: 28px !important; /* افزایش فاصله برای جا شدن کامل متن ارور */
    position: relative; /* پیش‌نیاز برای ارور دسکتاپ */
}
/* دکمه در موبایل نیاز به مارجین ندارد */
.stc-fluent-newsletter .ff-el-submit { 
    margin-bottom: 0 !important; 
}

/* 📱 استایل ارور در موبایل (جلوگیری از رفتن زیر فیلد بعدی) */
.stc-fluent-newsletter .error { 
    color: #EF4444 !important;
    font-size: 11.5px !important; 
    margin-top: 6px !important; 
    display: block !important;
    position: static !important; /* بسیار مهم: در موبایل نباید شناور باشد تا فیلد بعدی را هل بدهد پایین */
}

/* 💻 تنظیمات اختصاصی دسکتاپ (بدون تغییر و کاملاً سالم) */
@media (min-width: 768px) {
    .stc-fluent-newsletter .frm-fluent-form { 
        flex-direction: row; 
        align-items: flex-start;
        gap: 15px; 
    }
    
    .stc-fluent-newsletter .ff-t-cell,
    .stc-fluent-newsletter .ff-el-group { 
        flex: 1; 
        margin-bottom: 0 !important; 
    }
    
    .stc-fluent-newsletter .ff-btn-submit { 
        flex: 0 0 140px; 
        margin-bottom: 0 !important; 
    }
    
    .stc-fluent-newsletter .error { 
        position: absolute !important; 
        top: 100% !important; 
        right: 10px !important; 
        white-space: nowrap !important; 
    }
}

/* --- استایل‌های ظاهری فیلدها و دکمه --- */
.stc-fluent-newsletter .ff-el-form-control {
    background-color: #152942 !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    border-radius: 12px !important;
    height: 50px !important;
    padding: 0 20px !important;
    font-size: 14px !important;
    transition: 0.3s ease !important;
    box-shadow: none !important;
}
.stc-fluent-newsletter .ff-el-form-control:focus { 
    border-color: #C5A059 !important; 
    background-color: rgba(255, 255, 255, 0.05) !important; 
}
.stc-fluent-newsletter .ff-el-form-control::placeholder { 
    color: rgba(255, 255, 255, 0.4) !important; 
}
.stc-fluent-newsletter .ff-btn-submit {
    background-color: #C5A059 !important; 
    color: #0A192F !important; 
    height: 50px !important;
    border-radius: 12px !important; 
    font-weight: 800 !important; 
    font-size: 15px !important; 
    transition: 0.3s !important; 
    width: 100% !important;
    border: none !important;
}
.stc-fluent-newsletter .ff-btn-submit:hover { 
    background-color: #E5C07B !important; 
    transform: translateY(-2px) !important; 
}


/* ==========================================
   ۲. استایل‌های فرم پاپ‌آپ سازمانی (حالت روشن)
========================================== */
.stc-fluent-b2b .ff-el-group { margin-bottom: 20px !important; }
.stc-fluent-b2b .ff-el-input--label { font-size: 13px !important; font-weight: 800 !important; color: #0A192F !important; margin-bottom: 8px !important; }
.stc-fluent-b2b .ff-el-form-control {
    background-color: #ffffff !important; border: 1px solid #E2E8F0 !important; color: #1E293B !important;
    border-radius: 12px !important; height: 50px !important; padding: 0 15px !important; font-size: 14px !important; transition: 0.3s !important; box-shadow: none !important;
}
.stc-fluent-b2b .ff-el-form-control:focus { border-color: #0A192F !important; box-shadow: none !important; }
.stc-fluent-b2b .ff-el-form-control::placeholder { color: #94A3B8 !important; font-size: 13px !important; }

/* چپ‌چین کردن فیلدهای عددی و تلفن */
.stc-fluent-b2b input[type="tel"], .stc-fluent-b2b input[type="number"], .stc-fluent-b2b .ff-el-form-control.ff-el-numeric { direction: ltr !important; text-align: left !important; }

/* دکمه ارسال (سرمه‌ای طبق عکس) */
.stc-fluent-b2b .ff-btn-submit {
    background-color: #0A192F !important; color: #ffffff !important; height: 50px !important;
    border-radius: 12px !important; font-weight: 800 !important; font-size: 14px !important; transition: 0.3s !important; width: 100% !important;
}
.stc-fluent-b2b .ff-btn-submit:hover { background-color: #152942 !important; box-shadow: 0 10px 20px rgba(10,25,47,0.15) !important; }

/* پیام‌های موفقیت و خطا (هماهنگ با قالب) */
.fluentform .ff-message-success { background-color: rgba(16, 185, 129, 0.1) !important; color: #10B981 !important; border: 1px solid #10B981 !important; border-radius: 12px !important; font-weight: 800 !important; text-align: center !important; padding: 15px !important; }
.fluentform .error { color: #EF4444 !important; font-size: 11px !important; margin-top: 5px !important; font-weight: 700 !important; }

/* اصلاح پرش فیلدها در زمان نمایش ارور */
.stc-fluent-newsletter .frm-fluent-form { align-items: flex-start !important; }
.stc-fluent-newsletter .ff-el-group { position: relative !important; margin-bottom: 0 !important; }
.stc-fluent-newsletter .error { position: absolute !important; top: 100% !important; right: 10px !important; font-size: 11.5px !important; margin-top: 6px !important; white-space: nowrap !important; }