.elementor-11743 .elementor-element.elementor-element-9c29612{--display:flex;}/* Start custom CSS for container, class: .elementor-element-9c29612 */برای اینکه فرم گراویتی فرم (Gravity Forms) شما در وردپرس با المان‌تور کاملاً هماهنگ، مدرن و چشم‌نواز شود و از طیف رنگی **سورمه‌ای (`#0B1B35`)** و **نارنجی (`#F97316`)** به صورت حرفه‌ای استفاده کند، کد CSS زیر را آماده کرده‌ام.

### ویژگی‌های این استایل:
1. **طراحی مدرن و مینیمال فیلدها**: افزودن حاشیه نرم، افکت فوکوس حرفه‌ای با رنگ سورمه‌ای و نارنجی.
2. **دکمه ارسال جذاب**: گرادیانت نارنجی با سایه و انیمیشن ملایم هنگام هاور (Hover).
3. **بهینه‌سازی برچسب‌ها و فونت‌ها**: خوانایی بالا و تراز دقیق راست‌چین (RTL).

### کد CSS:

```css
/* کانتینر اصلی فرم */
#gform_wrapper_57 {
    direction: rtl;
    font-family: inherit;
    background: #ffffff;
    padding: 30px;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(11, 27, 53, 0.08);
    border: 1px solid rgba(11, 27, 53, 0.06);
    max-width: 600px;
    margin: 0 auto;
}

/* فاصله و ساختار فیلدها */
#gform_wrapper_57 .gfield {
    margin-bottom: 22px;
}

/* برچسب (Label) فیلدها */
#gform_wrapper_57 .gfield_label, 
#gform_wrapper_57 .gform-field-label {
    font-size: 14px;
    font-weight: 600;
    color: #0B1B35; /* سورمه‌ای */
    margin-bottom: 8px;
    display: block;
}

/* ستاره ضروری (ضروری) */
#gform_wrapper_57 .gfield_required {
    color: #F97316 !important; /* نارنجی */
    margin-right: 4px;
}

/* اینپوت‌ها و فیلدهای متنی و تلفن */
#gform_wrapper_57 input[type="text"],
#gform_wrapper_57 input[type="tel"],
#gform_wrapper_57 input[type="email"],
#gform_wrapper_57 textarea {
    width: 100%;
    padding: 12px 16px;
    background-color: #f8fafc;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    font-size: 14px;
    color: #0B1B35;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

/* حالت فوکوس (وقتی کاربر روی فیلد کلیک می‌کند) */
#gform_wrapper_57 input[type="text"]:focus,
#gform_wrapper_57 input[type="tel"]:focus,
#gform_wrapper_57 input[type="email"]:focus,
#gform_wrapper_57 textarea:focus {
    background-color: #ffffff;
    border-color: #F97316; /* حاشیه نارنجی */
    box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.12);
    outline: none;
}

/* فوتر و دکمه ارسال */
#gform_wrapper_57 .gform_footer {
    margin-top: 25px;
    padding: 0;
    text-align: left; /* یا center بر اساس سلیقه */
}

/* دکمه ارسال شکیل */
#gform_wrapper_57 .gform_button {
    background: linear-gradient(135deg, #F97316 0%, #ea580c 100%) !important;
    color: #ffffff !important;
    font-weight: 700;
    font-size: 15px;
    padding: 12px 32px !important;
    border: none !important;
    border-radius: 10px !important;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(249, 115, 22, 0.3);
    width: 100%; /* اگر دکمه تمام‌عرض می‌خواهید، این خط را نگه دارید */
}

/* هاور دکمه ارسال */
#gform_wrapper_57 .gform_button:hover {
    background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%) !important;
    box-shadow: 0 6px 16px rgba(249, 115, 22, 0.4);
    transform: translateY(-1px);
}

/* استایل ارورها در صورت خالی بودن فیلدها */
#gform_wrapper_57 .gfield_error input[type="text"],
#gform_wrapper_57 .gfield_error input[type="tel"] {
    border-color: #ef4444;
    background-color: #fef2f2;
}

#gform_wrapper_57 .gfield_description.validation_message {
    color: #ef4444;
    font-size: 12px;
    margin-top: 6px;
}
```

### نحوه استفاده:
1. این کد را کپی کنید.
2. در پیشخوان وردپرس، به بخش **نمایش > سفارشی‌سازی > CSS اضافی** بروید و کد را آنجا قرار دهید.
3. یا اگر از المان‌تور پرو استفاده می‌کنید، می‌توانید این کد را در تب **پیشرفته (Advanced)** بخش **Custom CSS** همان ابزارک کد کوتاه قرار دهید./* End custom CSS */