/**
 * GO.3Dify — Konfigüratör stilleri
 *
 * Tasarım ilkesi: arayüz gri tonlarında kalır, tek gerçek renk
 * müşterinin seçtiği filament rengidir. Etiketler ve sayılar
 * monospace — makine kontrol paneli hissi.
 *
 * Yol: wp-content/plugins/go3dify-konfigurator/assets/konfigurator.css
 */

/* ============================================================
   SAYFA DÜZENİ — galeri + konfigüratör
   ============================================================ */

/* Marka token'ları — g3d-global.css ile eşleştirildi (29.08.2026).
   Tema :root'ta --g3d-* tanımlıysa oradan devralınır; yoksa buradaki
   marka değerleri kullanılır. Tek yerden değişir. */
.go3d-sayfa,
.go3d-konfigurator {
	--go3d-murekkep:   var(--g3d-carbon,      #0E1116);
	--go3d-murekkep-2: var(--g3d-steel-2,     #3A4452);
	--go3d-murekkep-3: var(--g3d-titanium-2,  #6E7A88);
	--go3d-cizgi:      var(--g3d-cizgi-acik,  #E1E6EB);
	--go3d-panel:      var(--g3d-mist,        #EEF1F4);
	--go3d-tabla:      #C6CCD2;
	--go3d-tabla-cizgi: #B4BCC4;
	--go3d-uyari:      #C0392B;
	--go3d-onay:       #2C6B45;

	/* Tek vurgu rengi — YALNIZCA birincil aksiyonda */
	--go3d-accent:      var(--g3d-molten,      #FF6A2C);
	--go3d-accent-koyu: var(--g3d-molten-deep, #E2531A);
	--go3d-accent-metin: #1A0E07;

	/* Etiket ve sayı fontu — tema Space Mono yüklüyor */
	--go3d-mono: 'Space Mono', ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

.go3d-sayfa {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: 40px;
	align-items: start;

	/* Tema kendi konteynerini kuruyorsa --go3d-max-genislik: none yapın —
	   çift sınırlama olmasın. Varsayılan tema konteyneriyle aynı: 1240px. */
	max-width: var(--go3d-max-genislik, 1240px);
	margin: 0 auto;
}

.go3d-sayfa-tek {
	grid-template-columns: minmax(0, 1fr);
	max-width: var(--go3d-max-genislik-tek, 960px);
}

/* Konfigüratör ekranla birlikte kaysın — galeri uzun, seçimler
   sürekli görünür kalmalı. */
.go3d-sayfa-yan {
	position: sticky;
	/* Sabit başlığın yüksekliği JS tarafından ölçülüp yazılıyor.
	   Ölçüm başarısız olursa 24px'e düşer. */
	top: var(--go3d-ust-bosluk, 84px);
}

.go3d-sayfa .go3d-konfigurator { max-width: none; }

/* ---------- galeri ---------- */
.go3d-galeri { min-width: 0; }

.go3d-galeri-liste {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.go3d-galeri-oge {
	margin: 0;
	padding: 0;
	overflow: hidden;
	background: var(--go3d-panel);
	border-radius: 4px;
}

/* İlk görsel tam genişlik — en iyi fotoğraf burada durmalı */
.go3d-galeri-oge:first-child { grid-column: 1 / -1; }

.go3d-galeri-oge img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	transition: transform 400ms ease;
}

.go3d-galeri-oge:hover img { transform: scale(1.02); }

.go3d-galeri-noktalar { display: none; }

/* Yöneticiye görünen "galeri boş" bilgisi */
.go3d-galeri-bos {
	grid-column: 1 / -1;
	padding: 20px 22px;
	margin-bottom: 24px;
	font-size: 14px;
	line-height: 1.6;
	color: #7a3a12;
	background: #fbf1e8;
	border: 1px dashed #ebd3be;
	border-radius: 4px;
}

.go3d-galeri-bos p { margin: 8px 0 0; }

.go3d-galeri-bos code {
	padding: 2px 6px;
	font-size: 12.5px;
	background: rgba(0, 0, 0, .06);
	border-radius: 2px;
	word-break: break-all;
}

.go3d-galeri-bos-not {
	font-size: 12px;
	opacity: .7;
	padding-top: 8px;
	border-top: 1px solid #ebd3be;
}

.go3d-konfigurator {
	max-width: 960px;
	margin: 0 auto;
	color: var(--go3d-murekkep);
	font-size: 15px;
	line-height: 1.5;
}

.go3d-konfigurator *,
.go3d-konfigurator *::before,
.go3d-konfigurator *::after { box-sizing: border-box; }

/* ---------- baskı tablası önizlemesi ---------- */
.go3d-onizleme {
	min-height: 190px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 28px 16px;
	margin-bottom: 26px;
	border-radius: 12px;
	overflow: hidden;
	background-color: var(--go3d-tabla);
	background-image:
		linear-gradient(var(--go3d-tabla-cizgi) 1px, transparent 1px),
		linear-gradient(90deg, var(--go3d-tabla-cizgi) 1px, transparent 1px);
	background-size: 22px 22px;
	box-shadow: inset 0 0 60px rgba(0, 0, 0, .12);
}

.go3d-onizleme-metin {
	text-transform: none;
	/* Gölge kutunun dışına taşabiliyor — kırpılmasın diye pay */
	padding-right: 14px;
	line-height: 1.15;
	text-align: center;
	word-break: break-word;
	transition: text-shadow 160ms ease, color 160ms ease, font-size 160ms ease;
}

/* ---------- yerleşim ---------- */
.go3d-govde {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 26px;
}

.go3d-sutun { min-width: 0; }
.go3d-bolum { margin-bottom: 22px; }

.go3d-bolum-bas {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: 8px;
}

.go3d-etiket {
	font-family: var(--go3d-mono);
	font-size: 10px;
	letter-spacing: .14em;
	color: var(--go3d-murekkep-3);
}

.go3d-etiket-sag {
	font-family: var(--go3d-mono);
	font-size: 11px;
	color: var(--go3d-murekkep-2);
}

.go3d-ipucu {
	font-family: var(--go3d-mono);
	font-size: 10px;
	color: var(--go3d-murekkep-3);
	margin-top: 6px;
}

/* ---------- girdi ---------- */
.go3d-metin-girdi {
	/* Tema stilleri metni büyük harfe zorlayabilir — açıkça kapatıyoruz. */
	text-transform: none;
	width: 100%;
	padding: 13px 12px;
	font-size: 19px;
	font-weight: 700;
	color: var(--go3d-murekkep);
	background: #fff;
	border: 1px solid var(--go3d-cizgi);
	border-radius: 6px;
	outline: none;
}

.go3d-metin-girdi:focus {
	border-color: var(--go3d-murekkep);
	box-shadow: 0 0 0 2px rgba(22, 24, 28, .12);
}

/* ---------- seçim düğmeleri ---------- */
.go3d-secim-grup { display: flex; flex-wrap: wrap; gap: 8px; }
.go3d-font-grup { display: grid; grid-template-columns: 1fr 1fr; }

.go3d-secim {
	padding: 9px 12px;
	font-size: 14px;
	line-height: 1.25;
	color: var(--go3d-murekkep);
	background: #fff;
	border: 1px solid var(--go3d-cizgi);
	border-radius: 6px;
	cursor: pointer;
	transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}

.go3d-secim:hover { border-color: var(--go3d-murekkep-2); }

.go3d-secim.aktif {
	background: var(--go3d-murekkep);
	border-color: var(--go3d-murekkep);
	color: #fff;
}

.go3d-secim small { font-size: 10px; opacity: .75; }

.go3d-secim.pasif {
	opacity: .35;
	cursor: not-allowed;
	text-decoration: line-through;
}

.go3d-secim.pasif:hover { border-color: var(--go3d-cizgi); }

.go3d-secim:focus-visible {
	outline: 2px solid var(--go3d-murekkep);
	outline-offset: 2px;
}

.go3d-renk-grup .go3d-secim { padding: 0; border-width: 2px; }
.go3d-renk-grup .go3d-secim.aktif {
	border-color: var(--go3d-murekkep);
	outline: 1px solid var(--go3d-murekkep);
	outline-offset: 2px;
}

/* ---------- kullanım yeri kartları ---------- */
.go3d-kullanim-grup {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: 10px;
}

.go3d-kullanim {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 18px 12px 15px;
	text-align: center;
	background: #fff;
	border: 1px solid var(--go3d-cizgi);
	border-radius: 12px;
	cursor: pointer;
	transition: border-color 130ms ease, box-shadow 130ms ease, transform 130ms ease;
}

.go3d-kullanim:hover { border-color: var(--go3d-murekkep-2); }

.go3d-kullanim.aktif {
	border-color: var(--go3d-murekkep);
	box-shadow: 0 0 0 1px var(--go3d-murekkep);
}

.go3d-kullanim:focus-visible {
	outline: 2px solid var(--go3d-murekkep);
	outline-offset: 2px;
}

.go3d-kullanim-ikon {
	display: block;
	color: var(--go3d-murekkep-3);
	transition: color 130ms ease;
}

.go3d-kullanim.aktif .go3d-kullanim-ikon { color: var(--go3d-murekkep); }

.go3d-kullanim-ad {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--go3d-murekkep);
}

.go3d-kullanim-alt {
	font-size: 11px;
	line-height: 1.35;
	color: var(--go3d-murekkep-3);
}

/* ---------- bilgi satırları ---------- */
.go3d-kullanim-uyari,
.go3d-montaj {
	font-family: var(--go3d-mono);
	font-size: 11px;
	line-height: 1.5;
	color: var(--go3d-murekkep-2);
	margin-top: 10px;
}

.go3d-kullanim-uyari:empty,
.go3d-montaj:empty { display: none; }

/* ---------- özet ---------- */
.go3d-ozet {
	margin-top: 6px;
	padding: 18px;
	background: var(--go3d-panel);
	border: 1px solid var(--go3d-cizgi);
	border-radius: 12px;
}

.go3d-onay {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 16px;
	font-size: 13px;
	line-height: 1.45;
	color: var(--go3d-murekkep-2);
	cursor: pointer;
}

.go3d-onay input { margin-top: 3px; flex-shrink: 0; }

.go3d-ozet-satir {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
}

.go3d-toplam {
	font-size: 30px;
	font-weight: 600;
	line-height: 1.1;
	margin-top: 4px;
}

.go3d-satir-alt {
	font-family: var(--go3d-mono);
	font-size: 11px;
	color: var(--go3d-murekkep-2);
	margin-top: 4px;
}

.go3d-kargo {
	font-family: var(--go3d-mono);
	font-size: 11px;
	color: var(--go3d-murekkep-2);
	margin-top: 12px;
}

.go3d-kargo-bedava { color: var(--go3d-onay); }

.go3d-termin {
	font-family: var(--go3d-mono);
	font-size: 11px;
	color: var(--go3d-murekkep-2);
	margin-top: 5px;
}

.go3d-termin:empty { display: none; }

/* Sitedeki TEK accent kullanımı. Seçili durumlar mürekkep siyahı
   kalıyor — 19 renkli palette ikinci bir vurgu rengi kirlilik yaratıyor. */
.go3d-ekle {
	padding: 14px 26px;
	font-size: 15px;
	font-weight: 700;
	color: var(--go3d-accent-metin);
	background: var(--go3d-accent);
	border: none;
	border-radius: 6px;
	cursor: pointer;
	white-space: nowrap;
	transition: background 140ms ease, opacity 140ms ease;
}

.go3d-ekle:hover:not(:disabled) { background: var(--go3d-accent-koyu); }
.go3d-ekle:disabled { opacity: .35; cursor: not-allowed; }

.go3d-ekle:focus-visible {
	outline: 2px solid var(--go3d-accent-koyu);
	outline-offset: 3px;
}

.go3d-hata {
	display: none;
	margin-top: 12px;
	padding: 10px 12px;
	font-size: 13px;
	color: var(--go3d-uyari);
	background: #fbf1e8;
	border: 1px solid #ebd3be;
	border-radius: 2px;
}

/* ---------- kurulum hatası ---------- */
.go3d-kurulum-hatasi {
	padding: 18px 20px;
	background: #fbf1e8;
	border: 1px solid #ebd3be;
	border-radius: 4px;
	color: #7a3a12;
	font-size: 14px;
	line-height: 1.55;
}

.go3d-kurulum-hatasi p { margin: 8px 0 0; }

.go3d-kurulum-hatasi code {
	padding: 1px 5px;
	background: rgba(0, 0, 0, .06);
	border-radius: 2px;
	font-size: 12px;
}

.go3d-kurulum-cozum { border-top: 1px solid #ebd3be; margin-top: 12px !important; padding-top: 10px; }

/* ---------- mobil ---------- */
@media (max-width: 900px) {
	/* Galeri şerit moduna geçer — JS bu durumu overflow-x ile anlıyor,
	   ekran genişliği tahmini yapmıyor. */
	.go3d-sayfa {
		grid-template-columns: 1fr;
		gap: 22px;
	}

	.go3d-sayfa-yan { position: static; }

	.go3d-galeri-liste {
		display: flex;
		gap: 10px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	.go3d-galeri-liste::-webkit-scrollbar { display: none; }

	.go3d-galeri-oge {
		flex: 0 0 100%;
		scroll-snap-align: center;
	}

	.go3d-galeri-oge:first-child { grid-column: auto; }
	.go3d-galeri-oge:hover img { transform: none; }

	.go3d-galeri-noktalar {
		display: flex;
		justify-content: center;
		gap: 7px;
		margin-top: 12px;
	}

	.go3d-nokta {
		width: 7px;
		height: 7px;
		padding: 0;
		border: none;
		border-radius: 50%;
		background: var(--go3d-cizgi);
		cursor: pointer;
		transition: background 200ms ease, transform 200ms ease;
	}

	.go3d-nokta.aktif {
		background: var(--go3d-murekkep);
		transform: scale(1.35);
	}

	.go3d-nokta:focus-visible {
		outline: 2px solid var(--go3d-murekkep);
		outline-offset: 3px;
	}
}

@media (max-width: 782px) {
	.go3d-govde { grid-template-columns: 1fr; gap: 0; }

	.go3d-onizleme {
		position: sticky;
		top: var(--go3d-ust-bosluk, 72px);
		z-index: 10;
		min-height: 150px;
		margin-bottom: 20px;
	}

	.go3d-ozet-satir { flex-direction: column; align-items: stretch; }
	.go3d-ekle { width: 100%; margin-top: 14px; }
	.go3d-font-grup { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
	.go3d-konfigurator *,
	.go3d-konfigurator *::before,
	.go3d-konfigurator *::after {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
	}
}