/* ==========================================================================
   گلسار — حالت‌های فرم تماس
   --------------------------------------------------------------------------
   هم صفحه‌ی اصلی (کلاس‌های .field) و هم صفحه‌ی تماس (.ct-field) از همین
   فایل استفاده می‌کنند، چون هر دو یک جاوااسکریپت دارند و باید یک‌شکل دیده شوند.
   ========================================================================== */

/* ---------- پیام کلی بالای فرم ---------- */
.gf-note {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0 0 16px;
    padding: 13px 15px;
    border: 1px solid transparent;
    border-radius: 14px;
    font-size: 12.8px;
    line-height: 1.75;
}

.gf-note[hidden] { display: none !important; }

.gf-note b {
    font-size: 13.2px;
    font-weight: 600;
    letter-spacing: .01em;
}

.gf-note--ok {
    border-color: #d5e2cd;
    background: #f1f6ee;
    color: #35452c;
}

.gf-note--err {
    border-color: #efd5cf;
    background: #fdf1ee;
    color: #7c382f;
}

/* ---------- خطای زیر هر فیلد ---------- */
.gf-err {
    display: block;
    margin-top: 6px;
    font-size: 11.4px;
    line-height: 1.62;
    color: #b0453a;
}

/* ---------- قاب فیلد ناسالم ---------- */
.is-invalid input,
.is-invalid textarea,
.is-invalid select {
    border-color: #d98d82 !important;
}

.is-invalid input:focus,
.is-invalid textarea:focus,
.is-invalid select:focus {
    box-shadow: 0 0 0 3px rgba(176, 69, 58, .10) !important;
}

/* روی صفحه‌ی تماس، قاب درون .ct-select است */
.is-invalid .ct-select { border-color: #d98d82; }

/* ---------- تله‌ی ربات ----------
   بدون offset منفی: «left:-9999px» عرض سند را ۹۹۹۹px بیشتر می‌کرد و در
   صفحه‌ی RTL محتوا را به گوشه‌ی راست پرت می‌کرد. این نسخه هیچ فضایی نمی‌گیرد
   و هیچ عرضی هم به صفحه اضافه نمی‌کند. */
.gf-hp {
    position: absolute !important;
    left: auto !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ---------- حالت ارسال ---------- */
.js-contact-form.is-sending { cursor: progress; }

.js-contact-form [type="submit"][disabled] {
    cursor: progress;
    opacity: .68;
    pointer-events: none;
}

.js-contact-form.is-sending .field,
.js-contact-form.is-sending .ct-field {
    opacity: .72;
}

@media (prefers-reduced-motion: no-preference) {
    .js-contact-form .field,
    .js-contact-form .ct-field {
        transition: opacity .2s ease;
    }
}

/* ---------- دارک‌مود ---------- */
@media (prefers-color-scheme: dark) {
    .gf-note--ok {
        border-color: #34492c;
        background: #1e2a1c;
        color: #c6d8bb;
    }

    .gf-note--err {
        border-color: #5a2f28;
        background: #2a1c19;
        color: #e8bcb2;
    }

    .gf-err { color: #e08b7d; }
}
