/*
 * Teklif formlarının dosya alanı (PLAN, K110; Beest kararı, 22 Ekim 2026).
 * Paketten sapma: pakette dosya alanı yok. İhtiyacınız'ın altında
 * "Ürün listesi" (hizmet formunda "Belge"), isteğe bağlı, tek dosya.
 *
 * Contact Form 7'nin dosya girdisi görünmez ama odaklanabilir (paketteki
 * `.hk-gorunmez` kuralları); alanın ikinci etiketi "Dosya seçin", paketteki
 * ikincil düğme görünümünde. Klavyeyle girdiye gelince odak halkası
 * düğmede (paketteki `.hk-cip:has(input:focus-visible)` gibi). Yanında
 * seçilen dosyanın adı ve Kaldır (temanın teklif-ortak.js'i doldurur).
 * CF7 girdiyi `span.wpcf7-form-control-wrap` içine koyar; kap `contents`
 * olur, hata ipucu satırın altına iner.
 *
 * Ana sayfanın ve öbür şablonların stil zincirinde; `hk-` önekli sınıflar
 * şablonların formunda, öneksizler ana sayfanınkinde; renkler ve ölçüler o
 * zincirin belirteçlerinden.
 */

.hk-dosya,
.dosya {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.hk-dosya {
	gap: var(--bosluk-2) var(--bosluk-3);
}

.dosya {
	gap: var(--b2) var(--b3);
}

.hk-dosya > .wpcf7-form-control-wrap,
.dosya > .wpcf7-form-control-wrap {
	display: contents;
}

.hk-dosya__girdi,
.dosya__girdi {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
	opacity: 0;
}

.hk-dosya:has(.hk-dosya__girdi:focus-visible) .hk-dosya__dugme {
	outline: var(--odak-kalinligi) solid var(--odak);
	outline-offset: var(--odak-boslugu);
}

.dosya:has(.dosya__girdi:focus-visible) .dosya__dugme {
	outline: 3px solid var(--odak);
	outline-offset: 2px;
}

/* Hata: paketteki `.hk-alan--hata .hk-alan__girdi` gibi kalın kırmızı kenar. */
.hk-dosya:has(.wpcf7-not-valid) .hk-dosya__dugme {
	--hk-dugme-kenar: var(--hata);
	box-shadow: inset 0 0 0 var(--kenar-ince) var(--hata);
}

.dosya:has(.wpcf7-not-valid) .dosya__dugme {
	--d-kenar: var(--hata);
}

.hk-dosya .wpcf7-not-valid-tip,
.dosya .wpcf7-not-valid-tip {
	flex-basis: 100%;
	order: 1;
}

.hk-dosya__ad,
.dosya__ad {
	min-width: 0;
	font-family: var(--font-sans);
	font-size: 14px;
	line-height: 20px;
	overflow-wrap: anywhere;
}

.hk-dosya__ad {
	color: var(--metin-baslik);
}

.dosya__ad {
	color: var(--grafit);
}

.hk-dosya__ad:empty,
.dosya__ad:empty {
	display: none;
}

.hk-dosya__kaldir[hidden],
.dosya__kaldir[hidden] {
	display: none;
}

/* Ana sayfada paketin metin düğmesi (`.hk-dugme--metin`) yok. */
.dosya__kaldir {
	min-height: var(--kontrol-kucuk);
	padding: 0 var(--b2);
	border: 0;
	background: none;
	color: var(--baglanti);
	font-family: var(--font-sans);
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	cursor: pointer;
}

.dosya__kaldir:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/*
 * İhtiyacınız kutusu kısa ekranda küçülür (K110; Beest, 22 Ekim 2026:
 * "formun her elementi aynı anda gözükecek şekilde ihtiyacınız kutusunu
 * küçült"; ilk sürümde canlıda düğme yine kesiliyordu: "hala taşıyor").
 * Dosya alanı formu yaklaşık 120 px uzattı. Pencere ekranın yüksekliğine
 * sığmayınca kutu paketteki 4 satırdan sığana kadar, en az 1 satıra iner;
 * yer varsa paketteki boyda kalır. Pay: formun kutu dışındaki boyu (iç
 * boşlukları dahil) ve ekranın kenarındaki boşluk (1512 px'te ölçüldü:
 * genel 734 px, Ürün grubu alanı yüzünden; ürün ve hizmet 640; ana sayfa
 * 688). Turnstile'ın kutusu (anahtarlar tanımlıyken, canlıda) formu 65 px
 * (ana sayfada aralığıyla 81 px) uzatır; kutu varken pay o kadar büyür
 * (`--hk-ts-payi`). Kullanıcı kutuyu yine büyütebilir. 800 px'ten dar
 * ekranda pencere tam ekran ve kayar; kutu paketteki gibi.
 */
@media (min-width: 800px) {

	.hk-teklif-m textarea.hk-alan__girdi,
	.teklif textarea.alan__girdi {
		--hk-ihtiyac: calc(100dvh - var(--hk-ihtiyac-payi) - var(--hk-ts-payi));
	}

	.hk-teklif-m textarea.hk-alan__girdi {
		min-height: 50px;
		height: clamp(50px, var(--hk-ihtiyac), 122px);
	}

	.teklif textarea.alan__girdi {
		min-height: 46px;
		height: clamp(46px, var(--hk-ihtiyac), 118px);
	}

	.hk-teklif-m,
	.teklif {
		--hk-ihtiyac-payi: 640px;
		--hk-ts-payi: 0px;
	}

	.hk-teklif-m--genel {
		--hk-ihtiyac-payi: 734px;
	}

	.teklif {
		--hk-ihtiyac-payi: 688px;
	}

	.hk-teklif-m:has(.cf-turnstile) {
		--hk-ts-payi: 65px;
	}

	/* Ana sayfada kutunun formdaki aralığıyla. */
	.teklif:has(.cf-turnstile) {
		--hk-ts-payi: 81px;
	}
}