/**
 * assets/css/pages/randevu.css — Randevu ekranı.
 *
 * Ölçü/renk/tipografi tasarımdaki gibi SATIR İÇİ inline style'da durur. Burada yalnız
 * inline ile ifade edilemeyenler var: :focus-visible, ::placeholder ve Elementor zırhı.
 */

/* ── Odak halkası ─────────────────────────────────────────────────────────
 * Tasarım alanlara inline `outline:0` veriyor; inline bildirim mulubey.css'teki
 * `.mulubey-app :focus-visible` kuralını yendiği için klavye odağı görünmez kalıyordu.
 * !important ile geri alıyoruz — erişilebilirlik için zorunlu.
 * ───────────────────────────────────────────────────────────────────────── */
.mulubey-app form[data-mu-form] :is(input, select, textarea):focus-visible {
	outline: 2px solid #9A7A50 !important;
	outline-offset: 2px;
}

/* Fare/dokunmatik odağında da alan belirgin olsun (halka değil, kenarlık). */
.mulubey-app form[data-mu-form] :is(input[type="text"], input[type="tel"], input[type="email"], input[type="date"], select, textarea):focus {
	border-color: #9A7A50;
}

.mulubey-app form[data-mu-form] ::placeholder {
	color: #8C8A7C;
	opacity: 1;
}

.mulubey-app form[data-mu-form] select {
	cursor: pointer;
}

/* ── Elementor zırhı ──────────────────────────────────────────────────────
 * hello-elementor reset.css `button{color:#CC3366;border:1px solid #CC3366}` (0,0,1)
 * mulubey.css'te `.mulubey-app button{color:inherit;border:0}` ile sıfırlanıyor.
 * Gönder butonunun gerçek kenarlığı/rengi inline'da; hover ise mu-hv-cta-bg'den gelir.
 * Burada yalnız reset'in `button:hover{background-color:transparent}` kuralının
 * gradyanı yutmadığından emin oluyoruz (0,3,0).
 * ───────────────────────────────────────────────────────────────────────── */
.mulubey-app form[data-mu-form] button[type="submit"]:hover,
.mulubey-app form[data-mu-form] button[type="submit"]:focus {
	background: linear-gradient(180deg, #6E7052 0%, #565839 100%);
	color: #FFFFFF;
}

/* Elementor Pro Form template'i kullanıldığında (.mulubey-elform) taban stiller
 * mulubey.css'ten gelir; burada ek bir şey gerekmiyor. */

/* ── Mobil ────────────────────────────────────────────────────────────────
 * [data-split] tek sütuna mulubey.css'te düşüyor; formun iç ızgarası
 * repeat(auto-fit,minmax(240px,1fr)) zaten kendiliğinden sarıyor. Dar ekranda
 * gönder butonu satır boyunca yayılsın.
 * ───────────────────────────────────────────────────────────────────────── */
@media (max-width: 520px) {
	.mulubey-app form[data-mu-form="randevu"] button[type="submit"] {
		width: 100%;
		padding: 0 20px;
	}
}
