.elementor-7622 .elementor-element.elementor-element-01ecca2{--display:flex;}/* Start custom CSS for shortcode, class: .elementor-element-dc74a7d *//* ═══════════════════════════════════════════════════════════════ FLUENT FORMS — CUSTOM CSS Hero tasarımıyla uyumlu: Koyu lacivert + Neon mavi/cyan tema KULLANIM: 1. Fluent Forms > Formunu aç > Settings & Integrations > Custom CSS/JS 2. Aşağıdaki kodları yapıştır 3. ".fluent_form_26" ifadelerini kendi form class'ınla değiştir 4. Kaydet ═══════════════════════════════════════════════════════════════ */ /* ── 1. FORM CONTAINER ─────────────────────────────────────── */ form.fluent_form_26 { background: rgba(7, 16, 34, 0.85) !important; border: 1px solid rgba(29, 140, 248, 0.25) !important; border-radius: 20px !important; padding: 36px 40px !important; backdrop-filter: blur(12px) !important; box-shadow: 0 8px 48px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(29, 140, 248, 0.08), inset 0 1px 0 rgba(255,255,255,0.04) !important; font-family: 'Nunito', sans-serif !important; max-width: 680px !important; margin-left: auto !important; margin-right: auto !important; margin-bottom: 60px !important; } /* ── 2. LABEL (Alan başlıkları) ────────────────────────────── */ form.fluent_form_26 .ff-el-input--label label { font-family: 'Nunito', sans-serif !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: #7aa8cc !important; margin-bottom: 7px !important; } /* Zorunlu alan yıldızı */ form.fluent_form_26 .ff-el-input--label label .ff-el-is-required { color: #00e5ff !important; } /* ── 3. INPUT & TEXTAREA ───────────────────────────────────── */ form.fluent_form_26 .ff-el-form-control { background: rgba(4, 10, 20, 0.7) !important; border: 1px solid rgba(29, 140, 248, 0.3) !important; border-radius: 10px !important; color: #e8f4ff !important; font-family: 'Nunito', sans-serif !important; font-size: 14px !important; font-weight: 400 !important; padding: 13px 16px !important; transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease !important; box-shadow: inset 0 1px 3px rgba(0,0,0,0.4) !important; height: auto !important; } /* Placeholder rengi */ form.fluent_form_26 .ff-el-form-control::placeholder { color: rgba(122, 168, 204, 0.45) !important; font-size: 13px !important; font-weight: 300 !important; } /* Focus durumu — neon parlama */ form.fluent_form_26 .ff-el-form-control:focus { background: rgba(4, 10, 20, 0.9) !important; border-color: #1d8cf8 !important; outline: none !important; box-shadow: 0 0 0 3px rgba(29, 140, 248, 0.18), 0 0 16px rgba(29, 140, 248, 0.12), inset 0 1px 3px rgba(0,0,0,0.4) !important; } /* Textarea özel yükseklik */ form.fluent_form_26 textarea.ff-el-form-control { min-height: 110px !important; resize: vertical !important; line-height: 1.6 !important; } /* ── 4. FIELD WRAPPER ──────────────────────────────────────── */ form.fluent_form_26 .ff-el-group { margin-bottom: 20px !important; } /* ── 5. SUBMIT BUTTON ──────────────────────────────────────── */ form.fluent_form_26 .ff_submit_btn, form.fluent_form_26 button[type="submit"] { background: linear-gradient(90deg, #1d8cf8, #00e5ff) !important; color: #040a14 !important; font-family: 'Bebas Neue', 'Nunito', sans-serif !important; font-size: 17px !important; font-weight: 700 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; border: none !important; border-radius: 10px !important; padding: 14px 42px !important; cursor: pointer !important; transition: all 0.28s ease !important; box-shadow: 0 4px 20px rgba(29, 140, 248, 0.4), 0 0 30px rgba(0, 229, 255, 0.15) !important; width: 100% !important; margin-top: 6px !important; } form.fluent_form_26 .ff_submit_btn:hover, form.fluent_form_26 button[type="submit"]:hover { background: linear-gradient(90deg, #3a9fff, #00f5ff) !important; box-shadow: 0 6px 28px rgba(29, 140, 248, 0.6), 0 0 40px rgba(0, 229, 255, 0.25) !important; transform: translateY(-2px) !important; } form.fluent_form_26 .ff_submit_btn:active, form.fluent_form_26 button[type="submit"]:active { transform: translateY(0px) !important; box-shadow: 0 2px 12px rgba(29, 140, 248, 0.4) !important; } /* ── 6. HATA MESAJLARI ─────────────────────────────────────── */ form.fluent_form_26 .error.text-danger { color: #ff6b8a !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: 0.06em !important; margin-top: 5px !important; } form.fluent_form_26 .ff-el-form-control.error { border-color: rgba(255, 107, 138, 0.6) !important; box-shadow: 0 0 0 3px rgba(255, 107, 138, 0.12) !important; } /* ── 7. BAŞARI MESAJI ──────────────────────────────────────── */ form.fluent_form_26 .ff-message-success { background: rgba(0, 229, 255, 0.08) !important; border: 1px solid rgba(0, 229, 255, 0.35) !important; border-radius: 12px !important; color: #00e5ff !important; padding: 18px 22px !important; font-size: 14px !important; font-weight: 600 !important; text-align: center !important; } /* ── 8. SELECT / DROPDOWN ──────────────────────────────────── */ form.fluent_form_26 select.ff-el-form-control { appearance: none !important; -webkit-appearance: none !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231d8cf8' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 14px center !important; padding-right: 38px !important; cursor: pointer !important; } /* ── 9. CHECKBOX & RADIO ───────────────────────────────────── */ form.fluent_form_26 .ff-el-form-check-input { accent-color: #1d8cf8 !important; width: 16px !important; height: 16px !important; cursor: pointer !important; } form.fluent_form_26 .ff-el-form-check-label { color: #7aa8cc !important; font-size: 13px !important; font-weight: 500 !important; cursor: pointer !important; } form.fluent_form_26 .ff-el-form-check-label:hover { color: #e8f4ff !important; }/* End custom CSS */