.elementor-6951 .elementor-element.elementor-element-9b87e94{--display:flex;}/* Start custom CSS for shortcode, class: .elementor-element-a4d9c4e *//* ============================================================
   ISERA AKADEMİ — Bilgisayarlı Görü Bootcamp
   DEĞERLENDİRME ANKETİ — Fluent Forms Özel CSS
   Revize: Daha normal font + daha ferah iç boşluk
   ============================================================ */

/* ─── RENK DEĞİŞKENLERİ ─────────────────── */
:root {
  --v:        #7c3aed;
  --v-light:  #a78bfa;
  --v-pale:   #ede9fe;
  --v-mid:    #ddd6fe;
  --fg:       #1e1b4b;
  --fg-mid:   #4c1d95;
  --fg-soft:  #6d28d9;
  --muted:    #7c6fb5;
  --bg:       #f5f3ff;
  --surface:  #ffffff;
  --border:   rgba(124,58,237,0.15);
  --border-s: rgba(124,58,237,0.32);
  --success:  #10b981;
  --error:    #ef4444;
}

/* ─── SAYFA ARKA PLANI ───────────────────── */
body.page-id-6644,
.page-id-6644 .site-main,
.page-id-6644 #content {
  background-color: #f5f3ff !important;
  background-image:
    linear-gradient(rgba(124,58,237,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,58,237,0.05) 1px, transparent 1px) !important;
  background-size: 36px 36px !important;
}

/* ─── FORM KAPSAYICI ─────────────────────── */
.fluentform,
.ff_form_wrap {
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  max-width: 860px !important;
  margin: 24px auto 64px !important;
  background: var(--surface) !important;
  border: 1px solid var(--border-s) !important;
  border-radius: 16px !important;
  box-shadow:
    0 0 0 4px rgba(124,58,237,0.05),
    0 8px 32px rgba(124,58,237,0.10),
    0 32px 80px rgba(124,58,237,0.06) !important;
  overflow: hidden !important;
  position: relative !important;
  box-sizing: border-box !important;
}

/* Sol accent çizgisi */
.fluentform::before,
.ff_form_wrap::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: linear-gradient(to bottom, var(--v), var(--v-light));
  z-index: 2;
}

.fluentform::after,
.ff_form_wrap::after {
  display: none !important;
}

/* ─── FORM İÇ BOŞLUKLARI ─────────────────── */
/* Solda accent çizgisi olduğu için sol padding biraz daha fazla */
body.page-id-6644 .ff_form_wrap,
body.page-id-6644 .fluentform,
.ff_form_wrap,
.fluentform {
  padding-top: 0 !important;
}

.ff_form_wrap form,
.fluentform .ff-form-body,
.fluentform form {
  padding: 44px 48px 48px 56px !important;
  box-sizing: border-box !important;
}

/* İlk alanların üstte yapışık durmaması için */
.ff_form_wrap form > .ff-el-group:first-child,
.fluentform .ff-form-body > .ff-el-group:first-child,
.fluentform form > .ff-el-group:first-child {
  margin-top: 4px !important;
}

/* Genel alan aralıkları */
.ff-el-input--label,
.ff-el-form-group,
.ff-el-group {
  margin-bottom: 24px !important;
}

/* Fluent Forms kolon yapılarında kenarlara yapışmayı azalt */
.ff-t-container,
.ff_columns_total_2,
.ff_columns_total_3,
.ff_columns_total_4 {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

.ff-t-cell,
.ff-column,
.ff_columns_total_2 .ff-el-group,
.ff_columns_total_3 .ff-el-group,
.ff_columns_total_4 .ff-el-group {
  box-sizing: border-box !important;
}

.ff-t-cell:first-child,
.ff-column:first-child {
  padding-left: 0 !important;
}

.ff-t-cell:last-child,
.ff-column:last-child {
  padding-right: 0 !important;
}

/* ─── ETİKETLER ──────────────────────────── */
.ff-el-input--label label,
.ff-el-form-group label,
.ff-el-group label,
label.ff-el-is-required span,
.ff-el-input--label label span {
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  color: var(--fg) !important;
  margin-bottom: 10px !important;
  display: block !important;
  text-transform: none !important;
  line-height: 1.45 !important;
}

.ff-el-is-required .ff-el-input--label label::after,
.ff-el-form-group .text-danger {
  color: var(--v) !important;
}

.ff-el-is-required .ff-el-input--label label::after {
  content: ' *';
  font-size: 15px;
  line-height: 0;
  vertical-align: middle;
}

/* ─── TEXT & EMAIL INPUT ─────────────────── */
.ff-el-form-control,
input.ff-el-form-control,
.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="tel"],
.fluentform input[type="number"] {
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: var(--fg) !important;
  background: var(--bg) !important;
  border: 1.5px solid var(--border-s) !important;
  border-radius: 12px !important;
  padding: 15px 18px !important;
  min-height: 52px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: border-color 0.2s, box-shadow 0.2s, background 0.2s !important;
  outline: none !important;
  caret-color: var(--v);
  box-shadow: 0 1px 3px rgba(124,58,237,0.05) !important;
}

.ff-el-form-control::placeholder,
input.ff-el-form-control::placeholder,
.fluentform input[type="text"]::placeholder,
.fluentform input[type="email"]::placeholder,
.fluentform input[type="tel"]::placeholder,
.fluentform input[type="number"]::placeholder {
  color: #ab9ad8 !important;
  font-style: normal !important;
}

.ff-el-form-control:focus,
input.ff-el-form-control:focus,
.fluentform input[type="text"]:focus,
.fluentform input[type="email"]:focus,
.fluentform input[type="tel"]:focus,
.fluentform input[type="number"]:focus {
  border-color: var(--v) !important;
  background: #fff !important;
  box-shadow:
    0 0 0 3px rgba(124,58,237,0.12),
    0 1px 4px rgba(124,58,237,0.08) !important;
}

/* ─── TEXTAREA ───────────────────────────── */
textarea.ff-el-form-control,
.fluentform textarea {
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: var(--fg) !important;
  background: var(--bg) !important;
  border: 1.5px solid var(--border-s) !important;
  border-radius: 12px !important;
  padding: 15px 18px !important;
  min-height: 120px !important;
  resize: vertical !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  outline: none !important;
  caret-color: var(--v);
}

textarea.ff-el-form-control:focus,
.fluentform textarea:focus {
  border-color: var(--v) !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(124,58,237,0.12) !important;
}

textarea.ff-el-form-control::placeholder,
.fluentform textarea::placeholder {
  color: #ab9ad8 !important;
}

/* ─── SELECT / DROPDOWN ──────────────────── */
select.ff-el-form-control,
.fluentform select {
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: var(--fg) !important;
  background-color: var(--bg) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%237c3aed' d='M5 6L0 0h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  border: 1.5px solid var(--border-s) !important;
  border-radius: 12px !important;
  padding: 15px 42px 15px 18px !important;
  min-height: 52px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 100% !important;
  cursor: pointer;
  outline: none !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}

select.ff-el-form-control:focus,
.fluentform select:focus {
  border-color: var(--v) !important;
  box-shadow: 0 0 0 3px rgba(124,58,237,0.12) !important;
  background-color: #fff !important;
}

select.ff-el-form-control option {
  background: #fff !important;
  color: var(--fg) !important;
}

/* ─── RADIO & CHECKBOX — PILL ────────────── */
.ff-el-input--content .ff-checkable-grp {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 12px !important;
}

.ff-el-input--content input[type="radio"],
.ff-el-input--content input[type="checkbox"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  pointer-events: none !important;
}

.ff-el-input--content input[type="radio"] + span,
.ff-el-input--content input[type="radio"] + label,
.ff-el-input--content input[type="checkbox"] + span,
.ff-el-input--content input[type="checkbox"] + label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  padding: 11px 20px !important;
  border: 1.5px solid var(--border-s) !important;
  border-radius: 999px !important;
  background: var(--bg) !important;
  color: var(--muted) !important;
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  white-space: nowrap !important;
  user-select: none !important;
  letter-spacing: 0 !important;
}

.ff-el-input--content input[type="radio"] + span:hover,
.ff-el-input--content input[type="radio"] + label:hover,
.ff-el-input--content input[type="checkbox"] + span:hover,
.ff-el-input--content input[type="checkbox"] + label:hover {
  border-color: var(--v) !important;
  background: var(--v-pale) !important;
  color: var(--fg-mid) !important;
}

.ff-el-input--content input[type="radio"]:checked + span,
.ff-el-input--content input[type="radio"]:checked + label,
.ff-el-input--content input[type="checkbox"]:checked + span,
.ff-el-input--content input[type="checkbox"]:checked + label {
  background: var(--v) !important;
  border-color: var(--v) !important;
  color: #fff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 12px rgba(124,58,237,0.25) !important;
}

.ff-el-input--content input[type="radio"]:checked + span::before,
.ff-el-input--content input[type="radio"]:checked + label::before,
.ff-el-input--content input[type="checkbox"]:checked + span::before,
.ff-el-input--content input[type="checkbox"]:checked + label::before {
  content: '✓ ';
  font-size: 11px;
  margin-right: 4px;
  opacity: 0.9;
}

/* ─── RATING — 1-5 ───────────────────────── */
.ff-el-ratings,
.ff-rating-group,
.fluent_field_rating {
  display: flex !important;
  gap: 10px !important;
  margin-top: 12px !important;
  flex-wrap: wrap !important;
}

.ff-el-ratings label,
.ff-rating-group label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 50px !important;
  height: 50px !important;
  border: 1.5px solid var(--border-s) !important;
  border-radius: 12px !important;
  background: var(--bg) !important;
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  cursor: pointer !important;
  transition: all 0.15s !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ff-el-ratings input,
.ff-rating-group input {
  display: none !important;
}

.ff-el-ratings label:hover,
.ff-rating-group label:hover {
  border-color: var(--v) !important;
  background: var(--v-pale) !important;
  color: var(--v) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(124,58,237,0.15) !important;
}

.ff-el-ratings input:checked + label,
.ff-rating-group input:checked + label,
.ff-el-ratings label.active,
.ff-el-ratings label.ff-rating-active {
  background: var(--v) !important;
  border-color: var(--v) !important;
  color: #fff !important;
  box-shadow: 0 4px 16px rgba(124,58,237,0.30) !important;
  transform: translateY(-2px) !important;
}

/* ─── BÖLÜM AYIRICILAR ───────────────────── */
.ff-el-section-break {
  margin: 36px -48px 30px -56px !important;
  padding: 0 !important;
  border: none !important;
}

.ff-el-section-break h2,
.ff-el-section-break h3,
.ff-section-title {
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--v) !important;
  background: var(--v-pale) !important;
  border: none !important;
  border-top: 1px solid var(--border-s) !important;
  border-bottom: 1px solid var(--border-s) !important;
  padding: 14px 48px 14px 56px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.ff-el-section-break h2::before,
.ff-el-section-break h3::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--v);
  flex-shrink: 0;
}

/* ─── GÖNDER BUTONU ──────────────────────── */
.ff-btn-submit,
.fluentform .ff-btn-submit,
button.ff-btn.ff-btn-submit {
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  background: linear-gradient(135deg, #7c3aed, #6d28d9) !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 17px 48px !important;
  width: 100% !important;
  cursor: pointer !important;
  transition: all 0.2s !important;
  margin-top: 12px !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow:
    0 4px 16px rgba(124,58,237,0.30),
    0 1px 3px rgba(124,58,237,0.20) !important;
}

.ff-btn-submit::after {
  content: ' →';
  font-size: 15px;
  font-weight: 400;
}

.ff-btn-submit:hover,
.fluentform .ff-btn-submit:hover {
  background: linear-gradient(135deg, #6d28d9, #5b21b6) !important;
  box-shadow:
    0 8px 28px rgba(124,58,237,0.40),
    0 2px 6px rgba(124,58,237,0.20) !important;
  transform: translateY(-1px) !important;
}

.ff-btn-submit:active {
  transform: translateY(0) !important;
}

/* ─── HATA & BAŞARI ──────────────────────── */
.ff-el-is-error .ff-el-form-control,
.ff-el-is-error input,
.ff-el-is-error textarea,
.ff-el-is-error select {
  border-color: var(--error) !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,0.10) !important;
}

.error.text-danger,
.ff-el-is-error .error {
  color: var(--error) !important;
  font-size: 12px !important;
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  margin-top: 6px !important;
  display: block;
}

.error.text-danger::before {
  content: '⚠ ';
}

.ff-message-success,
.ff-errors-in-stack.ff-success-message {
  background: #f0fdf4 !important;
  border: 1.5px solid #86efac !important;
  border-left: 4px solid var(--success) !important;
  border-radius: 12px !important;
  padding: 24px 28px !important;
  color: #166534 !important;
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 14px !important;
  box-shadow: 0 4px 16px rgba(16,185,129,0.10) !important;
}

/* ─── SCROLLBAR ─────────────────────────── */
.fluentform ::-webkit-scrollbar {
  width: 5px;
}

.fluentform ::-webkit-scrollbar-track {
  background: var(--v-pale);
}

.fluentform ::-webkit-scrollbar-thumb {
  background: var(--v-mid);
  border-radius: 10px;
}

.fluentform ::-webkit-scrollbar-thumb:hover {
  background: var(--v-light);
}

/* ─── MOBİL UYUM ─────────────────────────── */
@media (max-width: 768px) {
  .fluentform,
  .ff_form_wrap {
    margin: 12px !important;
    border-radius: 12px !important;
  }

  .ff_form_wrap form,
  .fluentform .ff-form-body,
  .fluentform form {
    padding: 28px 18px 30px 24px !important;
  }

  .ff-el-section-break {
    margin: 28px -18px 22px -24px !important;
  }

  .ff-el-section-break h2,
  .ff-el-section-break h3,
  .ff-section-title {
    padding: 12px 18px 12px 24px !important;
  }

  .ff-el-input--content .ff-checkable-grp {
    flex-direction: column !important;
    gap: 8px !important;
  }

  .ff-el-input--content input[type="radio"] + span,
  .ff-el-input--content input[type="radio"] + label,
  .ff-el-input--content input[type="checkbox"] + span,
  .ff-el-input--content input[type="checkbox"] + label {
    width: 100% !important;
    justify-content: center !important;
    white-space: normal !important;
    text-align: center !important;
  }

  .ff-t-cell,
  .ff-column {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}/* End custom CSS */