/* Nesil Otomotiv · randevu formu (CF7 "Online Randevu") ve ana sayfa hızlı randevu kartı.
   Ölçüler tasarımın #/randevu sayfasından; renkler Elementor global renkleri. */

.nx-appt-form,
.nx-appt-done,
.nx-quick {
  --nx-sari: var(--e-global-color-primary, #EFDF00);
  --nx-siyah: var(--e-global-color-secondary, #000);
  --nx-metin: var(--e-global-color-text, #3E3F40);
  --nx-gri: var(--e-global-color-accent, #656666);
  --nx-acik: var(--e-global-color-c1light, #F2F2F2);
  --nx-cizgi: var(--e-global-color-c2bordr, #D9D9D6);
  --nx-pasif: var(--e-global-color-c4muted, #8C8C8B);
  --nx-hata: #C4000B;
  color: var(--nx-siyah);
}

/* Ortak alanlar */
.nx-f { display: grid; gap: 6px; font-size: 13px; font-weight: 600; min-width: 0; }
.nx-f-label { display: block; }
.nx-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
:is(.nx-appt-form, .nx-quick) .nx-input {
  width: 100%; min-width: 0; height: 48px; margin: 0; padding: 0 12px;
  border: 1px solid var(--nx-pasif); border-radius: 0; background: #fff; color: var(--nx-siyah);
  font: inherit; font-size: 16px; font-weight: 400; outline: none;
  transition: border-color .2s, box-shadow .2s;
}
:is(.nx-appt-form, .nx-quick) select.nx-input { padding: 0 12px; }
:is(.nx-appt-form, .nx-quick) textarea.nx-input { height: auto; padding: 10px 12px; font-size: 15px; resize: vertical; }
:is(.nx-appt-form, .nx-quick) .nx-input:focus { border-color: var(--nx-siyah); }
:is(.nx-appt-form, .nx-quick) .nx-input::placeholder { color: var(--nx-pasif); opacity: 1; }
:is(.nx-appt-form, .nx-quick) .nx-input.nx-plate { height: 52px; padding: 0 14px; font-size: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
:is(.nx-appt-form, .nx-quick) .nx-input.nx-plate:focus { box-shadow: inset 0 0 0 1px var(--nx-siyah); }
:is(.nx-appt-form, .nx-quick) .nx-input.nx-plate::placeholder { text-transform: none; }
:is(.nx-appt-form, .nx-quick) .nx-input[aria-invalid="true"] { border-color: var(--nx-hata); }
.nx-appt-form .wpcf7-form-control-wrap { display: block; min-width: 0; }

/* Seçim kutucukları (radyo düğmesi görünmez, kutu seçili hâlde siyah) */
.nx-chip {
  display: flex; align-items: center; justify-content: center; margin: 0;
  border: 1px solid var(--nx-cizgi); background: #fff; color: var(--nx-siyah);
  font-size: 14px; font-weight: 600; cursor: pointer; user-select: none;
  transition: background .2s, color .2s, border-color .2s;
}
.nx-chip input { appearance: none; width: 0; height: 0; margin: 0; border: 0; opacity: 0; }
.nx-chip:has(input:checked) { border-color: var(--nx-siyah); background: var(--nx-siyah); color: #fff; }
.nx-chip:has(input:focus-visible) { outline: 2px solid var(--nx-siyah); outline-offset: 2px; }
.nx-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.nx-chips-hizmet .nx-chip { padding: 10px 14px; }
.nx-chips-day { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.nx-chip-day { flex-direction: column; gap: 2px; padding: 8px 4px; }
.nx-day-dow { font-size: 11px; font-weight: 600; text-transform: uppercase; }
.nx-day-num { font-size: 20px; font-weight: 700; line-height: 1.2; }
.nx-day-mon { font-size: 11px; font-weight: 400; }
/* Tarih sayfalama: aralık yazısı + ‹ › */
.nx-day-nav { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.nx-day-nav[hidden] { display: none; }
.nx-day-range { flex: 1; font-size: 13px; font-weight: 600; color: var(--nx-gri); }
.nx-appt-form .nx-day-nav button {
  width: 36px; height: 36px; margin: 0; padding: 0; border: 1px solid var(--nx-cizgi); border-radius: 0;
  display: grid; place-items: center; background: #fff; color: var(--nx-siyah); line-height: 0; cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.nx-appt-form .nx-day-nav button:is(:hover, :focus-visible):not(:disabled) { border-color: var(--nx-siyah); background: var(--nx-siyah); color: #fff; }
.nx-appt-form .nx-day-nav button:focus:not(:hover) { background: #fff; color: var(--nx-siyah); }
.nx-appt-form .nx-day-nav button:disabled { color: var(--nx-cizgi); cursor: default; }
.nx-chips-time { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.nx-chip-time { padding: 9px 0; }
.nx-chip-time.nx-is-hidden { display: none; }
.nx-chips[aria-invalid="true"] .nx-chip:not(:has(input:checked)) { border-color: var(--nx-hata); }

/* Düğmeler: siyah, üzerine gelince sarı; ok fx.js data-hover ile kayar */
:is(.nx-appt-form, .nx-quick) .nx-btn {
  flex: 1; height: 52px; margin: 0; padding: 0 20px; border: 0; border-radius: 0;
  background: var(--nx-siyah); color: #fff; font: inherit; font-size: 16px; font-weight: 700; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  transition: background .25s, color .25s;
}
:is(.nx-appt-form, .nx-quick) .nx-btn:is(:hover, :focus-visible) { background: var(--nx-sari); color: var(--nx-siyah); }
.nx-arrow { display: inline-block; translate: calc(var(--h, 0) * 6px) 0; transition: translate .4s cubic-bezier(.16, 1, .3, 1); }

/* ---------- Randevu formu ---------- */
.nx-appt-form { margin: 0; }
.nx-appt-camp { margin-bottom: 20px; padding: 12px 16px; background: var(--nx-sari); font-size: 14px; font-weight: 700; }

.nx-appt-bar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin-bottom: 26px; }
.nx-appt-bar > div { display: flex; flex-direction: column; gap: 8px; font-size: 13px; font-weight: 700; color: var(--nx-pasif); transition: color .3s; }
.nx-appt-bar span { display: block; height: 4px; background: var(--nx-cizgi); overflow: hidden; }
.nx-appt-bar span::before { content: ""; display: block; height: 100%; background: var(--nx-siyah); transform-origin: 0 50%; scale: 0 1; transition: scale .6s cubic-bezier(.16, 1, .3, 1); }
.nx-appt-bar .is-on { color: var(--nx-siyah); }
.nx-appt-bar .is-on span::before { scale: 1 1; }
.nx-appt-sr { width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.nx-appt-step { display: grid; gap: 16px; min-width: 0; margin: 0; padding: 0; border: 0; }
.nx-appt-step[data-step="1"] { gap: 18px; }
.nx-appt-step[data-step="1"] .nx-f { gap: 8px; }
.nx-appt-step[data-step="2"] { gap: 14px; }
/* JS yoksa üç adım alt alta görünür; JS adımları tek tek gösterir. */
.nx-appt-js .nx-appt-step[hidden], .nx-is-hidden { display: none !important; }
.nx-appt-form:not(.nx-appt-js) .nx-appt-step + .nx-appt-step { margin-top: 28px; }

/* Tahmini ücret (2. adım, hizmetlerin altında) */
.nx-appt-price { display: grid; gap: 4px; padding: 14px 16px; background: var(--nx-acik); border-left: 4px solid var(--nx-sari); }
.nx-appt-price[hidden] { display: none; }
.nx-appt-price-k { font-size: 13px; font-weight: 600; color: var(--nx-gri); }
.nx-appt-price strong { font-size: 22px; font-weight: 700; line-height: 1.2; }
.nx-appt-price small { font-size: 13px; line-height: 1.4; color: var(--nx-metin); }

.nx-kvkk { font-size: 13px; line-height: 1.4; color: var(--nx-metin); }
.nx-kvkk .wpcf7-list-item { margin: 0; }
.nx-kvkk label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.nx-kvkk input { flex: none; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--nx-siyah); }
.nx-kvkk a { color: inherit; text-decoration: underline; }
.nx-appt-form .wpcf7-turnstile:empty { display: none; }

.nx-hp { display: none !important; }

.nx-appt-err { margin: 14px 0 0; font-size: 13px; font-weight: 600; color: var(--nx-hata); }
.nx-appt-err:empty { display: none; }
.nx-appt-form .wpcf7-not-valid-tip { display: none; }
.nx-appt-form .wpcf7-response-output { margin: 14px 0 0 !important; padding: 0 !important; border: 0 !important; font-size: 13px; font-weight: 600; color: var(--nx-hata); }
.nx-appt-form.invalid .wpcf7-response-output,
.nx-appt-form.sent .wpcf7-response-output { display: none; }

.nx-appt-actions { display: flex; gap: 10px; margin-top: 24px; }
:is(.nx-appt-form, .nx-appt-done) .nx-appt-back { height: 52px; margin: 0; padding: 0 20px; border: 1px solid var(--nx-siyah); border-radius: 0; background: #fff; color: var(--nx-siyah); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
/* Elementor kit'in buton hover / focus'u (siyah zemin, beyaz yazı) burada geçerli olmasın */
:is(.nx-appt-form, .nx-appt-done) .nx-appt-back:focus { border-color: var(--nx-siyah); background: #fff; color: var(--nx-siyah); }
:is(.nx-appt-form, .nx-appt-done) .nx-appt-back:is(:hover, :focus-visible) { border-color: var(--nx-siyah); background: var(--nx-acik); color: var(--nx-siyah); }
.nx-appt-form.submitting .nx-appt-submit { opacity: .6; pointer-events: none; }
.nx-appt-js .nx-appt-actions [hidden] { display: none; }

/* Bitiş ekranı */
.nx-appt-done { display: grid; gap: 18px; }
.nx-appt-done-ok { width: 52px; height: 52px; display: grid; place-items: center; background: var(--nx-sari); font-size: 28px; font-weight: 800; }
.nx-appt-done h2 { margin: 0; font-size: 28px; font-weight: 700; line-height: 1.2; }
.nx-appt-done p { margin: 0; font-size: 16px; line-height: 1.5; color: var(--nx-metin); }
.nx-appt-sum { display: grid; gap: 8px; padding: 18px; background: var(--nx-acik); font-size: 14px; }
.nx-appt-sum div { display: flex; justify-content: space-between; gap: 12px; }
.nx-appt-sum span { color: var(--nx-gri); }
.nx-appt-sum strong { text-align: right; }
.nx-appt-done .nx-appt-back { height: 48px; }

/* ---------- Ana sayfa hızlı randevu kartı ---------- */
.nx-quick { display: grid; gap: 16px; margin: 0; }
.nx-chips-quick { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.nx-chips-quick .nx-chip { padding: 12px 10px; font-weight: 700; text-align: center; }
.nx-quick .nx-btn { flex: none; }
.nx-quick .nx-appt-err { margin: -8px 0 0; }