/* =========================================================================
   استایل سفارشی گرویتی‌فرم - نسخه‌ی هماهنگ با تم Orbital (نسخه ۲، اصلاح‌شده)
   این نسخه جایگزین فایل قبلی بشه - فایل قبلی رو کامل حذف کنید تا تداخل نشه.

   نکته مهم: فرم‌های شما از تم "Orbital" گرویتی‌فرم استفاده می‌کنن که با
   CSS Variables کار می‌کنه (نه کلاس gravity-theme که قبلاً فرض کرده بودم).
   چون اون متغیرها مستقیم روی خود wrapper با ID ست شدن (اسپسیفیسیتی بالا)،
   استفاده از !important این‌جا ضروریه، وگرنه دوباره override می‌شه.
   ========================================================================= */

/* ---------- ۱. رنگ‌ها و شکل کلی: بازنویسی متغیرهای تم Orbital ---------- */
.gform-theme{
  /* رنگ اصلی برند - این عدد رو با رنگ برند تش‌پک عوض کنید */
  --gf-color-primary: #ff6b00 !important;
  --gf-color-primary-darker: #cc5600 !important;
  --gf-color-primary-lighter: #ff8c33 !important;
  --gf-color-primary-contrast: #ffffff !important;

  /* رنگ و بردر فیلدهای ورودی */
  --gf-ctrl-border-color: #d9dce1 !important;
  --gf-color-in-ctrl: #ffffff !important;
  --gf-color-in-ctrl-contrast: #1f2430 !important;
  --gf-color-in-ctrl-primary: #ff6b00 !important;

  /* گوشه‌های گرد و اندازه‌ها */
  --gf-radius: 10px !important;
  --gf-ctrl-btn-border-color-secondary: #d9dce1 !important;

  /* رنگ لیبل‌ها */
  --gf-ctrl-label-color-primary: #1f2430 !important;
  --gf-ctrl-label-color-secondary: #1f2430 !important;
}

/* ---------- ۲. کانتینر کلی و چیدمان ---------- */
.gform_wrapper.gform-theme{
  direction: rtl;
  text-align: right;
  max-width: 100%;
}

.gform_wrapper.gform-theme .gform_heading{
  text-align: right;
  margin-bottom: 20px;
}

.gform_wrapper.gform-theme .gform_title{
  font-weight: 700 !important;
  font-size: 1.5em !important;
}

.gform_wrapper.gform-theme .gform_fields{
  row-gap: 14px !important;
  column-gap: 16px !important;
}

/* ---------- ۳. لیبل‌ها ---------- */
.gform_wrapper.gform-theme .gfield_label,
.gform_wrapper.gform-theme .gform-field-label{
  font-weight: 600 !important;
  font-size: 0.95em !important;
  margin-bottom: 8px !important;
}

.gform_wrapper.gform-theme .gfield_required{
  color: #e64545 !important;
  margin-right: 3px;
}

/* ---------- ۴. فیلدهای متنی، عددی، تکست‌اریا ---------- */
.gform_wrapper.gform-theme input[type="text"],
.gform_wrapper.gform-theme input[type="email"],
.gform_wrapper.gform-theme input[type="tel"],
.gform_wrapper.gform-theme input[type="number"],
.gform_wrapper.gform-theme input[type="url"],
.gform_wrapper.gform-theme input.large,
.gform_wrapper.gform-theme input.medium{
  box-sizing: border-box !important;
  height: 48px !important;
  border-radius: var(--gf-radius) !important;
  padding: 0 16px !important;
  border-width: 1.5px !important;
  transition: border-color .18s ease, box-shadow .18s ease !important;
  box-shadow: 0 2px 6px rgba(20, 25, 35, 0.05) !important;
}

.gform_wrapper.gform-theme textarea{
  box-sizing: border-box !important;
  border-radius: var(--gf-radius) !important;
  padding: 12px 16px !important;
  border-width: 1.5px !important;
  transition: border-color .18s ease, box-shadow .18s ease !important;
  box-shadow: 0 2px 6px rgba(20, 25, 35, 0.05) !important;
}

.gform_wrapper.gform-theme textarea{
  /* حدوداً اندازه‌ی ۲ خط - اگه با فونت سایت هماهنگ نبود، همین عدد رو کم‌وزیاد کنید */
  height: 74px !important;
  min-height: 74px !important;
  line-height: 1.6 !important;
}

.gform_wrapper.gform-theme input[type="text"]:focus,
.gform_wrapper.gform-theme input[type="email"]:focus,
.gform_wrapper.gform-theme input[type="tel"]:focus,
.gform_wrapper.gform-theme input.large:focus,
.gform_wrapper.gform-theme textarea:focus,
.gform_wrapper.gform-theme select:focus{
  border-color: var(--gf-color-primary) !important;
  box-shadow: 0 0 0 4px rgba(255, 107, 0, 0.14) !important;
  outline: none !important;
}

/* ---------- ۵. دراپ‌داون‌ها (select) ---------- */
.gform_wrapper.gform-theme select,
.gform_wrapper.gform-theme select.gfield_select{
  /* حذف فلش پیش‌فرض مرورگر تا فلش خود تم گرویتی‌فرم جایگزینش بشه */
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;

  border-radius: var(--gf-radius) !important;
  padding: 12px 40px 12px 16px !important;
  border-width: 1.5px !important;
  border-style: solid !important;
  border-color: var(--gf-ctrl-border-color) !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(20, 25, 35, 0.05) !important;

  /* رنگ متن و پس‌زمینه رو عمداً دست نمی‌زنیم، همون پیش‌فرض خود تم می‌مونه */
  background-image: var(--gf-icon-ctrl-select) !important;
  background-repeat: no-repeat !important;
  background-size: 12px !important;
  background-position: left 16px center !important;
}

.gform_wrapper.gform-theme select:hover{
  border-color: #b9bfc8 !important;
}

.gform_wrapper.gform-theme select::-ms-expand{
  display: none !important;
}

/* ---------- ۶. چک‌باکس و رادیو ---------- */
.gform_wrapper.gform-theme input[type="checkbox"],
.gform_wrapper.gform-theme input[type="radio"]{
  accent-color: var(--gf-color-primary) !important;
  cursor: pointer !important;
}

.gform_wrapper.gform-theme .gfield_checkbox li,
.gform_wrapper.gform-theme .gfield_radio li{
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* ---------- ۷. پیام‌های خطا ---------- */
.gform_wrapper.gform-theme .gfield_error input,
.gform_wrapper.gform-theme .gfield_error textarea,
.gform_wrapper.gform-theme .gfield_error select{
  border-color: #e64545 !important;
  background: #fdeeee !important;
}

.gform_wrapper.gform-theme .validation_message{
  color: #e64545 !important;
  font-size: 0.85em !important;
  margin-top: 6px !important;
  font-weight: 500 !important;
}

.gform_wrapper.gform-theme .gform_validation_errors{
  border: 1.5px solid #e64545 !important;
  background: #fdeeee !important;
  border-radius: var(--gf-radius) !important;
  padding: 14px 18px !important;
}

/* ---------- ۸. پیام موفقیت ---------- */
.gform_confirmation_wrapper .gform_confirmation_message,
.gform_wrapper.gform-theme .gform_confirmation_message{
  border: 1.5px solid #1fa971 !important;
  background: #eafaf3 !important;
  color: #1fa971 !important;
  border-radius: var(--gf-radius) !important;
  padding: 16px 20px !important;
  font-weight: 500 !important;
}

/* ---------- ۹. دکمه ارسال ---------- */
.gform_wrapper.gform-theme .gform-footer,
.gform_wrapper.gform-theme .gform_footer{
  margin-top: 24px !important;
  text-align: right !important;
}

.gform_wrapper.gform-theme .gform_button,
.gform_wrapper.gform-theme input[type="submit"]{
  border-radius: var(--gf-radius) !important;
  padding: 13px 34px !important;
  font-weight: 600 !important;
  border: none !important;
  cursor: pointer !important;
  transition: transform .12s ease, box-shadow .18s ease !important;
  box-shadow: 0 4px 12px rgba(255, 107, 0, 0.28) !important;
}

.gform_wrapper.gform-theme .gform_button:hover,
.gform_wrapper.gform-theme input[type="submit"]:hover{
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(255, 107, 0, 0.36) !important;
}

/* ---------- ۱۰. آپلود فایل ---------- */
.gform_wrapper.gform-theme .ginput_container_fileupload{
  border: 1.5px dashed var(--gf-ctrl-border-color) !important;
  border-radius: var(--gf-radius) !important;
  padding: 16px !important;
  background: #f7f9fc !important;
  text-align: center !important;
}

/* ---------- ۱۱. ریسپانسیو موبایل ---------- */
@media (max-width: 640px){
  .gform_wrapper.gform-theme .gform_button,
  .gform_wrapper.gform-theme input[type="submit"]{
    width: 100% !important;
  }

  /* گرویتی‌فرم به‌صورت پیش‌فرض توی موبایل هر فیلد رو تمام‌عرض می‌کنه؛
     اینجا همون چیدمان کنار هم دسکتاپ رو توی موبایل هم نگه می‌داریم */
  .gform_wrapper.gform-theme .gform_fields{
    display: flex !important;
    flex-wrap: wrap !important;
  }

  .gform_wrapper.gform-theme .gfield{
    box-sizing: border-box !important;
  }

  .gform_wrapper.gform-theme .gfield--width-half{
    width: calc(50% - 7px) !important;
    flex: 0 0 calc(50% - 7px) !important;
    max-width: calc(50% - 7px) !important;
  }

  .gform_wrapper.gform-theme .gfield--width-third{
    width: calc(33.333% - 11px) !important;
    flex: 0 0 calc(33.333% - 11px) !important;
    max-width: calc(33.333% - 11px) !important;
  }

  .gform_wrapper.gform-theme .gfield--width-full{
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* توی عرض کم موبایل، فاصله‌ها و فونت رو کمی جمع‌وجورتر می‌کنیم تا دو ستون جا بشه */
  .gform_wrapper.gform-theme .gform_fields{
    column-gap: 10px !important;
  }

  .gform_wrapper.gform-theme input[type="text"],
  .gform_wrapper.gform-theme input[type="email"],
  .gform_wrapper.gform-theme input[type="tel"],
  .gform_wrapper.gform-theme input[type="number"],
  .gform_wrapper.gform-theme input.large,
  .gform_wrapper.gform-theme select,
  .gform_wrapper.gform-theme .gf-custom-select-trigger{
    font-size: 0.9em !important;
  }
}