/*
 * GAPAS Member — ön yüz tasarım sistemi.
 *
 * NEDEN KENDİ SİSTEMİ:
 * Dernek sitesi Elementor ile kurulu ve tema kendi düğme/form stillerini
 * global olarak basıyor. Bootstrap eklemek çakışma ve !important savaşı
 * demek olurdu; CDN de canlı sitenin dış kaynağa istek atması demek.
 * Onun yerine her kural bir .gapas- kökü altında kapsamlanmış, çıplak
 * eleman seçicisi (h3, table, input) tek başına hiçbir yerde kullanılmıyor.
 * Böylece bu bileşenler sayfanın geri kalanına taşmıyor, tema da bunları
 * bozmuyor.
 *
 * ────────────────────────────────────────────────────────────────────────
 * NEDEN KOYU TEMA YOK
 *
 * Bir aşama koyu tema desteği yazılmıştı, sonra kaldırıldı. Sebebi:
 * dernek sitesinin teması koyu modu desteklemiyor — işletim sistemi koyu
 * moddayken de sayfa gövdesi beyaz kalıyor. Bizim bileşenlerimiz tek başına
 * koyulaşınca beyaz sayfanın ortasında koyu bir ada oluşuyor ve sonuç hiç
 * koyu tema olmamasından daha kötü görünüyordu.
 *
 * Site geneline koyu tema geldiği gün buraya @media (prefers-color-scheme)
 * bloğu eklemek yeterli: bütün renkler zaten değişkenden geliyor.
 * ────────────────────────────────────────────────────────────────────────
 */

.gapas-panel,
.gapas-basvuru,
.gapas-kurul,
.gapas-profil,
.gapas-dizin {
	/* GAPAS logosundaki altın sarısı ve sıcak nötrler */
	--g-metin:      #1c1a16;
	--g-soft:       #55504a;
	--g-soluk:      #7a7367;
	--g-cizgi:      #e3dfd5;
	--g-cizgi-acik: #efece5;
	--g-zemin:      #ffffff;
	--g-yuzey:      #fbfaf7;

	--g-vurgu:      #8a6710;
	--g-vurgu-koyu: #6f520c;
	--g-vurgu-zemin:#f7f0dd;

	--g-iyi:        #2a6a2a;
	--g-iyi-zemin:  #eaf3e8;
	--g-uyari:      #8a6100;
	--g-uyari-zemin:#fbf2dc;
	--g-kritik:     #96341f;
	--g-kritik-zemin:#f9e9e4;

	--g-r:   10px;
	--g-r-s: 6px;
	--g-golge: 0 1px 2px rgba(28, 26, 22, .05), 0 8px 24px -14px rgba(28, 26, 22, .22);

	color: var(--g-metin);
	font-size: 15px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

/*
 * ═══════════════════════════════════════════ TEMA ETKİSİZLEŞTİRME
 *
 * Elementor'ün site kiti (.elementor-kit-222) ve tema, başlık/düğme/form
 * renklerini genel seçicilerle basıyor:
 *
 *     .elementor-kit-222 h2 { color: #000f2b }        → (0,1,1)
 *     .elementor-kit-222 button { background: … }     → (0,1,1)
 *
 * Bizim bileşenlerimiz rengi MİRAS yoluyla alıyordu; miras, doğrudan bir
 * kurala her zaman yenilir. Sonuç: koyu temada koyu lacivert başlıklar koyu
 * zemin üzerinde okunamıyordu.
 *
 * Çözüm !important değil, özgüllük. Kök sınıfı İKİ KEZ yazıyoruz:
 *
 *     .gapas-panel.gapas-panel h2   → (0,2,1)
 *     .elementor-kit-222 h2         → (0,1,1)
 *
 * Tek kez yazmak (0,1,1) verir ve berabere kalır; berabere kalan kurallarda
 * sonra yüklenen kazanır — Elementor'ün kit dosyası bizden sonra yükleniyor,
 * dolayısıyla tek kök yetmedi. Çift yazım aynı elemanı seçer ama özgüllüğü
 * bir sınıf artırır; sıralamadan bağımsız olarak kazanır.
 */

.gapas-panel.gapas-panel h2, .gapas-panel.gapas-panel h3, .gapas-panel.gapas-panel h4,
.gapas-basvuru.gapas-basvuru h2, .gapas-basvuru.gapas-basvuru h3, .gapas-basvuru.gapas-basvuru h4,
.gapas-profil.gapas-profil h2, .gapas-profil.gapas-profil h3, .gapas-profil.gapas-profil h4,
.gapas-dizin.gapas-dizin h2, .gapas-dizin.gapas-dizin h3,
.gapas-kurul.gapas-kurul h3 {
	color: var(--g-metin);
	font-family: inherit;
	text-transform: none;
	letter-spacing: normal;
}

/* Bölüm ve profil başlıkları kendi soluk tonunu geri alsın. */
.gapas-panel.gapas-panel .gapas-alt-baslik-fe,
.gapas-profil.gapas-profil .gapas-profil__bolum h3,
.gapas-basvuru.gapas-basvuru .gapas-alan-grubu > legend {
	color: var(--g-soluk);
	text-transform: uppercase;
	letter-spacing: .07em;
}

.gapas-kurul.gapas-kurul .gapas-kurul__unvan { color: var(--g-vurgu); }

.gapas-panel.gapas-panel p, .gapas-panel.gapas-panel li,
.gapas-panel.gapas-panel td, .gapas-panel.gapas-panel dd,
.gapas-basvuru.gapas-basvuru p, .gapas-basvuru.gapas-basvuru li,
.gapas-profil.gapas-profil p, .gapas-profil.gapas-profil li,
.gapas-profil.gapas-profil dd,
.gapas-dizin.gapas-dizin p {
	color: inherit;
}

/*
 * Bağlantılar.
 *
 * Tema `.entry-content a` ile camgöbeği bir renk basıyor (0,1,1). Bizim
 * kart ve satır bağlantılarımız rengi miras alıyordu; sonuç açık zeminde
 * 1.9:1 kontrastlı, okunmayan bir camgöbeğiydi. Renk burada kendi
 * değişkenimize geri çekiliyor; vurgulanması gereken bağlantılar kendi
 * kuralında ayrıca renk alıyor.
 */
.gapas-panel.gapas-panel a,
.gapas-basvuru.gapas-basvuru a,
.gapas-profil.gapas-profil a,
.gapas-dizin.gapas-dizin a,
.gapas-kurul.gapas-kurul a {
	color: var(--g-metin);
	text-decoration: none;
}

.gapas-panel.gapas-panel .gapas-tablo-fe a,
.gapas-profil.gapas-profil .gapas-profil__yazilar a:hover strong {
	color: var(--g-vurgu);
}

.gapas-profil.gapas-profil .gapas-profil__baglanti:hover,
.gapas-kurul.gapas-kurul .gapas-kurul__baglanti:hover { color: var(--g-vurgu); }

/* Düğme ve form denetimleri temanın kendi görünümünü almasın. */
.gapas-panel.gapas-panel button, .gapas-panel.gapas-panel input,
.gapas-panel.gapas-panel select, .gapas-panel.gapas-panel textarea,
.gapas-basvuru.gapas-basvuru button, .gapas-basvuru.gapas-basvuru input,
.gapas-basvuru.gapas-basvuru select, .gapas-basvuru.gapas-basvuru textarea,
.gapas-profil.gapas-profil button,
.gapas-dizin.gapas-dizin input, .gapas-dizin.gapas-dizin button {
	font-family: inherit;
	letter-spacing: normal;
	text-transform: none;
	text-shadow: none;
	box-shadow: none;
}

/* ═══════════════════════════════════════════════════ ORTAK PARÇALAR */

.gapas-rozet {
	display: inline-flex;
	align-items: center;
	padding: 2px 10px;
	border: 1px solid var(--g-cizgi);
	border-radius: 999px;
	background: var(--g-yuzey);
	color: var(--g-soluk);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.7;
	white-space: nowrap;
}

.gapas-rozet.g-aktif        { border-color: var(--g-iyi);    color: var(--g-iyi);    background: var(--g-iyi-zemin); }
.gapas-rozet.g-beklemede,
.gapas-rozet.g-askida       { border-color: var(--g-uyari);  color: var(--g-uyari);  background: var(--g-uyari-zemin); }
.gapas-rozet.g-sonlandirildi,
.gapas-rozet.g-reddedildi   { border-color: var(--g-kritik); color: var(--g-kritik); background: var(--g-kritik-zemin); }
.gapas-rozet.g-cepi         { border-color: var(--g-vurgu);  color: var(--g-vurgu);  background: var(--g-vurgu-zemin); }

.gapas-panel.gapas-panel code,
.gapas-profil.gapas-profil code,
.gapas-dizin.gapas-dizin code {
	color: var(--g-soft);
	padding: 2px 7px;
	border-radius: var(--g-r-s);
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	font-size: 12.5px;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	letter-spacing: .02em;
}

.gapas-ipucu {
	display: block;
	margin-top: 4px;
	color: var(--g-soluk);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.5;
}

.gapas-zorunlu { color: var(--g-kritik); }

.gapas-bos-durum {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 32px 20px;
	text-align: center;
	background: var(--g-yuzey);
	border: 1px dashed var(--g-cizgi);
	border-radius: var(--g-r);
}
.gapas-bos-durum > strong { font-size: 15px; }
.gapas-bos-durum > span   { color: var(--g-soluk); font-size: 13.5px; max-width: 46ch; margin: 0 auto; }

.gapas-bos { margin: 0; color: var(--g-soluk); font-style: italic; }

.gapas-gizli-etiket {
	position: absolute;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Geniş içerik kendi kutusunda kaysın; sayfa gövdesi yana kaymasın. */
.gapas-sarmal-fe { overflow-x: auto; }

/*
 * ─────────────────────────────────────────────────────── DÜĞMELER
 *
 * Her kural kök sınıfla kapsamlı: `.elementor-kit-222 button` (0,1,1)
 * yalın `.gapas-dugme`yi (0,1,0) eziyordu; birincil düğme beyaz görünüyordu.
 */
.gapas-panel.gapas-panel .gapas-dugme,
.gapas-basvuru.gapas-basvuru .gapas-dugme,
.gapas-profil.gapas-profil .gapas-dugme,
.gapas-dizin.gapas-dizin .gapas-dugme {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px 18px;
	border: 1px solid transparent;
	border-radius: var(--g-r-s);
	background: var(--g-zemin);
	color: var(--g-metin);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
	text-shadow: none;
	cursor: pointer;
	transition: background-color .14s ease, border-color .14s ease, color .14s ease;
}

/*
 * [hidden] düğme gerçekten gizlensin.
 *
 * Yukarıdaki `display` kuralı (0,3,0) tarayıcının varsayılan
 * `[hidden]{display:none}` kuralını eziyordu; bu yüzden ilk adımda
 * "Geri" düğmesi hidden olmasına rağmen görünüyordu. Aynı kapsamda
 * [hidden] ekleyerek (0,4,0) yeniden gizliyoruz.
 */
.gapas-panel.gapas-panel .gapas-dugme[hidden],
.gapas-basvuru.gapas-basvuru .gapas-dugme[hidden],
.gapas-profil.gapas-profil .gapas-dugme[hidden],
.gapas-dizin.gapas-dizin .gapas-dugme[hidden] { display: none; }

.gapas-panel.gapas-panel .gapas-dugme.g-birincil,
.gapas-basvuru.gapas-basvuru .gapas-dugme.g-birincil,
.gapas-profil.gapas-profil .gapas-dugme.g-birincil,
.gapas-dizin.gapas-dizin .gapas-dugme.g-birincil {
	background: var(--g-vurgu);
	border-color: var(--g-vurgu);
	color: #fff;
}
.gapas-panel.gapas-panel .gapas-dugme.g-birincil:hover,
.gapas-basvuru.gapas-basvuru .gapas-dugme.g-birincil:hover {
	background: var(--g-vurgu-koyu);
	border-color: var(--g-vurgu-koyu);
	color: #fff;
}

.gapas-panel.gapas-panel .gapas-dugme.g-ikincil,
.gapas-basvuru.gapas-basvuru .gapas-dugme.g-ikincil,
.gapas-profil.gapas-profil .gapas-dugme.g-ikincil,
.gapas-dizin.gapas-dizin .gapas-dugme.g-ikincil {
	background: var(--g-zemin);
	border-color: var(--g-cizgi);
	color: var(--g-metin);
}
.gapas-panel.gapas-panel .gapas-dugme.g-ikincil:hover,
.gapas-basvuru.gapas-basvuru .gapas-dugme.g-ikincil:hover {
	background: var(--g-yuzey);
	border-color: var(--g-soluk);
}

.gapas-panel.gapas-panel .gapas-dugme.g-tehlike,
.gapas-basvuru.gapas-basvuru .gapas-dugme.g-tehlike {
	background: transparent;
	border-color: var(--g-kritik);
	color: var(--g-kritik);
}
.gapas-panel.gapas-panel .gapas-dugme.g-tehlike:hover,
.gapas-basvuru.gapas-basvuru .gapas-dugme.g-tehlike:hover { background: var(--g-kritik); color: #fff; }

.gapas-panel.gapas-panel .gapas-dugme.g-kucuk,
.gapas-basvuru.gapas-basvuru .gapas-dugme.g-kucuk,
.gapas-profil.gapas-profil .gapas-dugme.g-kucuk { padding: 6px 12px; font-size: 13px; }

.gapas-panel.gapas-panel .gapas-dugme.g-buyuk,
.gapas-basvuru.gapas-basvuru .gapas-dugme.g-buyuk { padding: 13px 28px; font-size: 15px; }

.gapas-panel.gapas-panel .gapas-dugme[disabled],
.gapas-basvuru.gapas-basvuru .gapas-dugme[disabled] { opacity: .5; cursor: not-allowed; }

.gapas-panel :focus-visible,
.gapas-basvuru :focus-visible,
.gapas-dizin :focus-visible,
.gapas-profil :focus-visible {
	outline: 2px solid var(--g-vurgu);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.gapas-dugme,
	.gapas-panel-menu__oge,
	.gapas-uye-karti { transition: none; }
}

/* ═══════════════════════════════════════════════════════════ PANEL */

.gapas-panel { max-width: 1040px; }

/* ───────────────────────────────────────────────── Kimlik kartı */

.gapas-kimlik {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px;
	padding: 22px 24px;
	margin-bottom: 18px;
	background: var(--g-zemin);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r);
	box-shadow: var(--g-golge);
}

.gapas-kimlik__avatar {
	width: 64px;
	height: 64px;
	flex: 0 0 auto;
	border-radius: 50%;
	object-fit: cover;
	background: var(--g-yuzey);
}

.gapas-kimlik__bilgi { flex: 1 1 240px; min-width: 0; }

.gapas-kimlik__bilgi h2 {
	margin: 0;
	font-size: 22px;
	line-height: 1.25;
	text-wrap: balance;
}

.gapas-kimlik__firma {
	margin: 2px 0 0;
	color: var(--g-soft);
	font-size: 14px;
}

.gapas-kimlik__etiketler {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 10px;
}

.gapas-kimlik__tarih { color: var(--g-soluk); font-size: 12.5px; }

.gapas-kimlik__borc {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	gap: 1px;
	padding: 12px 18px;
	border-radius: var(--g-r-s);
	border: 1px solid var(--g-cizgi);
	text-align: right;
}
.gapas-kimlik__borc.g-uyari  { border-color: var(--g-uyari);  background: var(--g-uyari-zemin); }
.gapas-kimlik__borc.g-kritik { border-color: var(--g-kritik); background: var(--g-kritik-zemin); }
.gapas-kimlik__borc .etiket { color: var(--g-soft); font-size: 12px; font-weight: 600; }
.gapas-kimlik__borc .deger  { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.2; }
.gapas-kimlik__borc .alt    { color: var(--g-soluk); font-size: 12px; }

/* ────────────────────────────────────────────────── Sayı kutuları */

.gapas-panel__kutular {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 12px;
	margin-bottom: 20px;
}

.gapas-panel__kutu {
	padding: 16px 18px;
	background: var(--g-zemin);
	border: 1px solid var(--g-cizgi);
	border-left: 3px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
}
.gapas-panel__kutu .deger  { font-size: 24px; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.gapas-panel__kutu .etiket { margin-top: 3px; font-size: 13px; font-weight: 600; }
.gapas-panel__kutu .alt    { color: var(--g-soluk); font-size: 12px; }

.gapas-panel__kutu.g-iyi    { border-left-color: var(--g-iyi); }
.gapas-panel__kutu.g-uyari  { border-left-color: var(--g-uyari); }
.gapas-panel__kutu.g-kritik { border-left-color: var(--g-kritik); }
.gapas-panel__kutu.g-vurgu  { border-left-color: var(--g-vurgu); }
.gapas-panel__kutu.g-bos    { opacity: .6; }

/* ──────────────────────────────────────────────── Bölüm menüsü */

.gapas-panel-menu {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin-bottom: -1px;
	padding: 0;
	border-bottom: 1px solid var(--g-cizgi);
}

.gapas-panel.gapas-panel .gapas-panel-menu__oge {
	padding: 11px 18px;
	border: 1px solid transparent;
	border-bottom: 0;
	border-radius: var(--g-r-s) var(--g-r-s) 0 0;
	background: transparent;
	color: var(--g-soft);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	text-shadow: none;
	cursor: pointer;
	transition: background-color .14s ease, color .14s ease;
}
.gapas-panel.gapas-panel .gapas-panel-menu__oge:hover { background: var(--g-yuzey); color: var(--g-metin); }

.gapas-panel.gapas-panel .gapas-panel-menu__oge.g-aktif {
	background: var(--g-zemin);
	border-color: var(--g-cizgi);
	color: var(--g-metin);
	box-shadow: inset 0 3px 0 var(--g-vurgu);
}

/* Menü yalnızca betik varken anlamlı; yoksa bölümler alt alta durur. */
.gapas-panel:not(.g-sekmeli) .gapas-panel-menu { display: none; }

/* ─────────────────────────────────────────────────────── Bölümler */

.gapas-panel__govde {
	background: var(--g-zemin);
	border: 1px solid var(--g-cizgi);
	border-radius: 0 var(--g-r) var(--g-r) var(--g-r);
	box-shadow: var(--g-golge);
}

.gapas-panel__bolum {
	padding: 26px 28px;
	border-bottom: 1px solid var(--g-cizgi-acik);
}
.gapas-panel__bolum:last-child { border-bottom: 0; }

.gapas-panel__bolum > h3 {
	margin: 0 0 16px;
	font-size: 17px;
	line-height: 1.3;
}

/* Sekme kipinde her bölüm sayfanın tamamını kaplar. */
.gapas-panel.g-sekmeli .gapas-panel__bolum { border-bottom: 0; }
.gapas-panel.g-sekmeli .gapas-panel__bolum[hidden] { display: none; }

.gapas-alt-baslik-fe {
	margin: 26px 0 12px;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--g-soluk);
}

/* ═══════════════════════════════════════════════════ TABLO / LİSTE */

.gapas-tablo-fe {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

.gapas-tablo-fe th,
.gapas-tablo-fe td {
	padding: 11px 12px;
	text-align: left;
	border-bottom: 1px solid var(--g-cizgi-acik);
}

.gapas-tablo-fe th {
	color: var(--g-soluk);
	font-size: 11.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	border-bottom-color: var(--g-cizgi);
}

.gapas-tablo-fe td.sag,
.gapas-tablo-fe th.sag { text-align: right; font-variant-numeric: tabular-nums; }

.gapas-tablo-fe tbody tr:last-child td { border-bottom: 0; }
.gapas-tablo-fe tbody tr:hover { background: var(--g-yuzey); }

.gapas-kart-listesi {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.gapas-kart-listesi__oge {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding: 13px 16px;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
}
.gapas-kart-listesi__oge > div { min-width: 0; }

.gapas-liste { margin: 0; padding: 0; list-style: none; }
.gapas-liste > li { padding: 10px 0; border-bottom: 1px solid var(--g-cizgi-acik); }
.gapas-liste > li:last-child { border-bottom: 0; }

/* ─────────────────────────────────────────────── Duyuru / hesap */

.gapas-duyuru {
	padding: 18px 20px;
	margin-bottom: 12px;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-left: 3px solid var(--g-vurgu);
	border-radius: var(--g-r-s);
}
.gapas-duyuru:last-child { margin-bottom: 0; }
.gapas-duyuru h4   { margin: 0 0 2px; font-size: 15.5px; }
.gapas-duyuru time { color: var(--g-soluk); font-size: 12.5px; }
.gapas-duyuru > div > *:last-child { margin-bottom: 0; }

.gapas-hesaplar {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 10px;
	margin-bottom: 18px;
}

.gapas-hesap {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 14px 16px;
	background: var(--g-zemin);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
}
.gapas-hesap > span { color: var(--g-soluk); font-size: 13px; }
.gapas-hesap > code { margin-top: 4px; cursor: pointer; word-break: break-all; }

.gapas-detay {
	margin-top: 20px;
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	background: var(--g-yuzey);
}
.gapas-detay > summary {
	padding: 14px 16px;
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	list-style-position: inside;
}
.gapas-detay__ic { padding: 4px 16px 18px; border-top: 1px solid var(--g-cizgi); }

/* ═══════════════════════════════════════════════════════════ FORM */

.gapas-form label {
	display: block;
	margin-bottom: 15px;
	font-size: 14px;
	font-weight: 600;
}

.gapas-panel.gapas-panel .gapas-form input[type="text"],
.gapas-panel.gapas-panel .gapas-form input[type="email"],
.gapas-panel.gapas-panel .gapas-form input[type="tel"],
.gapas-panel.gapas-panel .gapas-form input[type="url"],
.gapas-panel.gapas-panel .gapas-form input[type="date"],
.gapas-panel.gapas-panel .gapas-form input[type="number"],
.gapas-panel.gapas-panel .gapas-form input[type="file"],
.gapas-panel.gapas-panel .gapas-form select,
.gapas-panel.gapas-panel .gapas-form textarea,
.gapas-basvuru.gapas-basvuru .gapas-form input[type="text"],
.gapas-basvuru.gapas-basvuru .gapas-form input[type="email"],
.gapas-basvuru.gapas-basvuru .gapas-form input[type="tel"],
.gapas-basvuru.gapas-basvuru .gapas-form input[type="url"],
.gapas-basvuru.gapas-basvuru .gapas-form input[type="date"],
.gapas-basvuru.gapas-basvuru .gapas-form input[type="number"],
.gapas-basvuru.gapas-basvuru .gapas-form input[type="file"],
.gapas-basvuru.gapas-basvuru .gapas-form select,
.gapas-basvuru.gapas-basvuru .gapas-form textarea {
	display: block;
	width: 100%;
	max-width: 440px;
	margin-top: 6px;
	padding: 10px 12px;
	background: var(--g-zemin);
	color: var(--g-metin);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	font: inherit;
	font-weight: 400;
}

.gapas-form input:hover,
.gapas-form select:hover,
.gapas-form textarea:hover { border-color: var(--g-soluk); }

.gapas-form-alan { margin-bottom: 16px; }
.gapas-form-alan > label { margin-bottom: 0; }

.gapas-alan-grubu {
	padding: 20px 22px;
	margin: 0 0 18px;
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r);
	background: var(--g-zemin);
}
.gapas-alan-grubu > legend {
	padding: 0 9px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .07em;
	color: var(--g-soluk);
}

.gapas-onay {
	display: flex !important;
	align-items: flex-start;
	gap: 9px;
	margin-bottom: 9px;
	font-weight: 400;
	font-size: 14px;
	cursor: pointer;
}
.gapas-onay input[type="checkbox"] { margin-top: 3px; flex: 0 0 auto; }

.gapas-onay-izgara {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 2px 16px;
}

/* Gizlilik ana anahtarı — alt seçenekleri açar/kapatır. */
.gapas-anahtar {
	display: flex !important;
	align-items: flex-start;
	gap: 11px;
	padding: 14px 16px;
	margin-bottom: 0;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	cursor: pointer;
	font-weight: 400;
}
.gapas-anahtar input { margin-top: 3px; flex: 0 0 auto; }
.gapas-anahtar__govde { display: flex; flex-direction: column; gap: 2px; }
.gapas-anahtar__govde > span { color: var(--g-soluk); font-size: 13px; }

.gapas-gizlilik__alanlar {
	padding: 16px 4px 0;
	transition: opacity .2s ease;
}
.gapas-gizlilik__alanlar[data-kapali] { opacity: .45; pointer-events: none; }

.gapas-form-eylem { margin-top: 22px; }

/*
 * Bal küpü. display:none KULLANILMAZ — bazı otomatik araçlar gizli alanları
 * atlar ve tuzağa düşmez. Görsel olarak kaldırılır ama DOM'da "görünür"
 * kalır; gerçek kullanıcı ekranda hiç görmez.
 */
.gapas-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ═══════════════════════════════════════════════════════ BAŞVURU */

.gapas-basvuru { max-width: 780px; }

.gapas-adimlar {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.gapas-adim {
	display: flex;
	align-items: center;
	gap: 9px;
	flex: 1 1 160px;
	padding: 12px 14px;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	color: var(--g-soluk);
	font-size: 13.5px;
	font-weight: 600;
}

.gapas-adim__no {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: var(--g-cizgi);
	color: var(--g-soft);
	font-size: 12.5px;
	font-weight: 700;
}

.gapas-adim.g-aktif {
	background: var(--g-vurgu-zemin);
	border-color: var(--g-vurgu);
	color: var(--g-metin);
}
.gapas-adim.g-aktif .gapas-adim__no { background: var(--g-vurgu); color: #fff; }

.gapas-adim.g-tamam .gapas-adim__no { background: var(--g-iyi); color: #fff; }
.gapas-adim.g-tamam { border-color: var(--g-iyi); }

.gapas-adim-gezinme {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	margin-top: 20px;
}
.gapas-adim-gezinme [data-gapas-geri] { margin-right: auto; }
.gapas-adim-gezinme [data-gapas-ileri] { margin-left: auto; }

/* Betik yokken adımlar birer bölüm başlığı gibi durur, gizlenmez. */
.gapas-basvuru.g-adimli [data-gapas-adim-govde][hidden] { display: none; }

/* ─────────────────────────────────────────────────── Seçim kartı */

.gapas-secim-kartlari {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 12px;
}

.gapas-secim-karti { position: relative; margin: 0 !important; cursor: pointer; }
.gapas-secim-karti input { position: absolute; opacity: 0; pointer-events: none; }

.gapas-secim-karti__ic {
	display: flex;
	flex-direction: column;
	gap: 2px;
	height: 100%;
	padding: 16px;
	background: var(--g-zemin);
	border: 2px solid var(--g-cizgi);
	border-radius: var(--g-r);
	transition: border-color .14s ease, background-color .14s ease;
}
.gapas-secim-karti__ic strong { font-size: 15px; }
.gapas-secim-karti__ic > span { color: var(--g-soluk); font-size: 13px; font-weight: 400; }

.gapas-secim-karti__aidat {
	margin-top: 8px;
	color: var(--g-metin) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	font-variant-numeric: tabular-nums;
}

.gapas-secim-karti input:checked + .gapas-secim-karti__ic {
	border-color: var(--g-vurgu);
	background: var(--g-vurgu-zemin);
}
.gapas-secim-karti input:focus-visible + .gapas-secim-karti__ic {
	outline: 2px solid var(--g-vurgu);
	outline-offset: 2px;
}

/* ──────────────────────────────────────────── Belge / sözleşme */

.gapas-belge-alani {
	padding: 14px 0;
	border-bottom: 1px dashed var(--g-cizgi);
}
.gapas-belge-alani:last-child { border-bottom: 0; padding-bottom: 0; }
.gapas-belge-alani > label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; }
.gapas-belge-alani input[type="file"] { max-width: 440px; }

.gapas-sozlesme-satiri {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding: 12px 0;
	border-bottom: 1px solid var(--g-cizgi-acik);
}
.gapas-sozlesme-satiri:last-child { border-bottom: 0; }
.gapas-sozlesme-satiri .gapas-onay { margin-bottom: 0; }

.gapas-sozlesme-metin {
	max-height: 55vh;
	overflow-y: auto;
	padding-right: 8px;
	font-size: 14.5px;
	line-height: 1.7;
}
.gapas-sozlesme-surum {
	margin: 14px 0 0;
	padding-top: 12px;
	border-top: 1px solid var(--g-cizgi);
	color: var(--g-soluk);
	font-size: 12.5px;
}

/* ═══════════════════════════════════════════════════ BİLDİRİMLER */

.gapas-not {
	padding: 14px 18px;
	margin-bottom: 18px;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-left: 3px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
}
.gapas-not p:last-child { margin-bottom: 0; }
.gapas-not.g-iyi    { border-left-color: var(--g-iyi);    background: var(--g-iyi-zemin); }
.gapas-not.g-uyari  { border-left-color: var(--g-uyari);  background: var(--g-uyari-zemin); }
.gapas-not.g-kritik { border-left-color: var(--g-kritik); background: var(--g-kritik-zemin); }

.gapas-kilit,
.gapas-bilgi {
	max-width: 560px;
	margin: 0 auto;
	padding: 40px 28px;
	text-align: center;
	background: var(--g-yuzey);
	border: 1px dashed var(--g-cizgi);
	border-radius: var(--g-r);
	color: var(--g-soft);
}
.gapas-kilit p:first-child { margin-top: 0; font-size: 16px; }

/* ═══════════════════════════════════════════════════════ DİZİN */

.gapas-dizin__arama {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
}

.gapas-dizin.gapas-dizin .gapas-dizin__arama input[type="search"] {
	flex: 1 1 auto;
	max-width: 420px;
	padding: 11px 14px;
	background: var(--g-zemin);
	color: var(--g-metin);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	font: inherit;
	box-shadow: none;
}

.gapas-dizin__sayi { color: var(--g-soluk); font-size: 13px; font-variant-numeric: tabular-nums; }

.gapas-dizin__izgara {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 12px;
}

.gapas-uye-karti {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px;
	background: var(--g-zemin);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r);
	text-decoration: none;
	color: inherit;
	transition: border-color .14s ease, box-shadow .14s ease;
}
.gapas-uye-karti:hover {
	border-color: var(--g-vurgu);
	box-shadow: var(--g-golge);
	text-decoration: none;
}

.gapas-uye-karti img {
	width: 56px;
	height: 56px;
	flex: 0 0 auto;
	border-radius: 50%;
	object-fit: cover;
	background: var(--g-yuzey);
}

.gapas-uye-karti__govde {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
	align-items: flex-start;
}
.gapas-uye-karti__govde > strong { font-size: 15px; line-height: 1.3; }
.gapas-uye-karti__firma {
	color: var(--g-soluk);
	font-size: 13px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}

.gapas-dizin__bos {
	padding: 32px 20px;
	text-align: center;
	color: var(--g-soluk);
}

/* ═══════════════════════════════════════════════════════ PROFİL */

.gapas-profil { max-width: 940px; }

.gapas-profil__ust {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
	padding: 26px 28px;
	background: var(--g-zemin);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r) var(--g-r) 0 0;
}

.gapas-profil__avatar {
	width: 96px;
	height: 96px;
	flex: 0 0 auto;
	border-radius: 50%;
	object-fit: cover;
	background: var(--g-yuzey);
}

.gapas-profil__kimlik { flex: 1 1 240px; min-width: 0; }
.gapas-profil__kimlik h2 { margin: 0; font-size: 25px; line-height: 1.2; text-wrap: balance; }
.gapas-profil__firma { margin: 4px 0 0; color: var(--g-soft); font-size: 15px; }

.gapas-profil__rozetler {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
}

.gapas-profil__govde {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0;
	background: var(--g-zemin);
	border: 1px solid var(--g-cizgi);
	border-top: 0;
	border-radius: 0 0 var(--g-r) var(--g-r);
	box-shadow: var(--g-golge);
}

.gapas-profil__ana { min-width: 0; }

.gapas-profil__bolum {
	padding: 24px 28px;
	border-bottom: 1px solid var(--g-cizgi-acik);
}
.gapas-profil__bolum:last-child { border-bottom: 0; }
.gapas-profil__bolum h3 {
	margin: 0 0 14px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .07em;
	color: var(--g-soluk);
}

.gapas-profil__iletisim { display: flex; flex-wrap: wrap; gap: 8px; }

.gapas-profil__baglanti {
	padding: 7px 14px;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-radius: 999px;
	color: var(--g-metin);
	font-size: 13.5px;
	text-decoration: none;
}
.gapas-profil__baglanti:hover { border-color: var(--g-vurgu); color: var(--g-vurgu); }

.gapas-profil__alanlar { margin: 0; }
.gapas-profil__satir {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 18px;
	padding: 9px 0;
	border-bottom: 1px solid var(--g-cizgi-acik);
}
.gapas-profil__satir:last-child { border-bottom: 0; }
.gapas-profil__satir dt { flex: 0 0 180px; color: var(--g-soluk); font-size: 13.5px; }
.gapas-profil__satir dd { flex: 1 1 200px; margin: 0; font-size: 14.5px; }

.gapas-profil__yazilar { margin: 0; padding: 0; list-style: none; }
.gapas-profil__yazilar li { border-bottom: 1px solid var(--g-cizgi-acik); }
.gapas-profil__yazilar li:last-child { border-bottom: 0; }
.gapas-profil__yazilar a {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 11px 0;
	color: inherit;
	text-decoration: none;
}
.gapas-profil__yazilar a:hover strong { color: var(--g-vurgu); }
.gapas-profil__yazilar time { color: var(--g-soluk); font-size: 12.5px; }

.gapas-profil__yan {
	flex: 0 0 auto;
	padding: 24px;
	border-left: 1px solid var(--g-cizgi-acik);
}

.gapas-profil__qr {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	width: 178px;
}
.gapas-profil__qr img {
	width: 150px;
	height: 150px;
	padding: 10px;
	background: #fff;
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	image-rendering: pixelated;
}
.gapas-profil__qr span { color: var(--g-soluk); font-size: 12px; text-align: center; line-height: 1.4; }

.gapas-profil--yok {
	padding: 48px 24px;
	text-align: center;
	color: var(--g-soluk);
}

/* Profil paylaşım kutusu (panelde) */
.gapas-paylas {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px;
	padding: 18px 20px;
	margin-top: 20px;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r);
}
.gapas-paylas__qr {
	width: 120px;
	height: 120px;
	flex: 0 0 auto;
	padding: 8px;
	background: #fff;
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	image-rendering: pixelated;
}
.gapas-paylas__govde { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; min-width: 0; }
.gapas-paylas__adres { cursor: pointer; word-break: break-all; max-width: 100%; }

/* ═══════════════════════════════════════════════ YÖNETİM KURULU */

.gapas-kurul {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 18px;
}

.gapas-kurul__kisi {
	padding: 24px 18px;
	text-align: center;
	background: var(--g-zemin);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r);
	transition: box-shadow .14s ease;
}
.gapas-kurul__kisi:hover { box-shadow: var(--g-golge); }

.gapas-kurul__kisi img {
	width: 84px;
	height: 84px;
	margin-bottom: 14px;
	border-radius: 50%;
	object-fit: cover;
	background: var(--g-yuzey);
}
.gapas-kurul__kisi h3 { margin: 0 0 4px; font-size: 16px; line-height: 1.3; }

.gapas-kurul__unvan {
	margin: 0;
	color: var(--g-vurgu);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .07em;
}

.gapas-kurul__baglanti {
	display: inline-block;
	margin-top: 12px;
	color: var(--g-soft);
	font-size: 13px;
	text-decoration: none;
	border-bottom: 1px solid var(--g-cizgi);
}
.gapas-kurul__baglanti:hover { color: var(--g-vurgu); border-color: var(--g-vurgu); }

/* ═══════════════════════════════════════════════════════ MOBİL */

@media (max-width: 860px) {
	.gapas-profil__govde { grid-template-columns: minmax(0, 1fr); }
	.gapas-profil__yan {
		border-left: 0;
		border-top: 1px solid var(--g-cizgi-acik);
		display: flex;
		justify-content: center;
	}
}

@media (max-width: 640px) {
	.gapas-kimlik        { padding: 18px; gap: 14px; }
	.gapas-kimlik__borc  { width: 100%; text-align: left; }
	.gapas-panel__kutular{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gapas-panel__bolum  { padding: 20px 16px; }
	.gapas-profil__ust,
	.gapas-profil__bolum { padding: 20px 16px; }
	.gapas-alan-grubu    { padding: 16px 14px; }

	/*
	 * Bölüm menüsü mobilde yana kayan bir şerit olur. Sarmalamak, altı
	 * sekmede üç satırlık bir menü demek; içeriği ekrandan aşağı iterdi.
	 */
	.gapas-panel-menu {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
	}
	.gapas-panel-menu::-webkit-scrollbar { display: none; }
	.gapas-panel-menu__oge { white-space: nowrap; padding: 11px 14px; }

	.gapas-panel__govde  { border-radius: var(--g-r); }
	.gapas-dugme         { width: 100%; }
	.gapas-adim-gezinme .gapas-dugme { width: auto; }
	.gapas-dizin__izgara { grid-template-columns: 1fr; }
	.gapas-adim__ad      { display: none; }
	.gapas-adim          { flex: 0 0 auto; justify-content: center; }
	.gapas-tablo-fe      { font-size: 13px; }
	.gapas-tablo-fe th,
	.gapas-tablo-fe td   { padding: 9px 8px; }
	.gapas-profil__satir dt { flex-basis: 100%; }
}

/*
 * ═══════════════════════════════════════ KOYU TEMA SON DOKUNUŞLARI
 *
 * Bu blok DOSYANIN SONUNDA duruyor ve bu bilinçli. Değişken tanımlarının
 * hemen ardına konduğunda, aynı özgüllükteki temel kurallar (dosyanın
 * ortasındaki .g-birincil renk tanımı gibi) sonradan geldiği için üstüne
 * yazıyordu. Renk düzeltmeleri, düzelttikleri kuraldan sonra gelmeli.
 */


/* ─────────────────────────────────────────────────── Profil fotoğrafı */

.gapas-avatar-kutu {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	flex-wrap: wrap;
}

.gapas-avatar-kutu__onizleme {
	width: 96px;
	height: 96px;
	flex: 0 0 auto;
	border-radius: 50%;
	object-fit: cover;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
}

.gapas-avatar-kutu__govde {
	flex: 1 1 260px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.gapas-avatar-kutu__govde form { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.gapas-avatar-kutu__etiket { font-size: 14px; font-weight: 600; }

/* ═══════════════════════════════════════════════ BİLGİ SAYFALARI */

/*
 * Uzun metin sayfaları (Üyelik Hakkında gibi).
 *
 * .gapas-bilgi ile KARIŞTIRMAYIN: o, panelde tek cümlelik durum
 * mesajları için dar ve ortalanmış bir kutu. Bu sayfa sınıfı ilk
 * yazımda yanlışlıkla onu kullanmış ve altı başlıklı bir metin 560px
 * genişliğinde ortalanmış olarak çıkmıştı.
 */

.gapas-icerik {
	--g-metin:      #1c1a16;
	--g-soft:       #55504a;
	--g-soluk:      #7a7367;
	--g-cizgi:      #e3dfd5;
	--g-cizgi-acik: #efece5;
	--g-zemin:      #ffffff;
	--g-yuzey:      #fbfaf7;
	--g-vurgu:      #8a6710;
	--g-r:   10px;
	--g-r-s: 6px;

	max-width: 78ch;
	color: var(--g-metin);
	font-size: 16px;
	line-height: 1.75;
}

.gapas-icerik.gapas-icerik h2 {
	margin: 44px 0 14px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--g-cizgi);
	font-size: 24px;
	line-height: 1.25;
	color: var(--g-metin);
	text-wrap: balance;
}
.gapas-icerik.gapas-icerik h2:first-child { margin-top: 0; }

.gapas-icerik.gapas-icerik h3 {
	margin: 26px 0 6px;
	font-size: 17px;
	line-height: 1.3;
	color: var(--g-vurgu);
}

.gapas-icerik.gapas-icerik p,
.gapas-icerik.gapas-icerik li { color: var(--g-metin); }

.gapas-icerik p  { margin: 0 0 16px; }
.gapas-icerik ul { margin: 0 0 20px; padding-left: 22px; }
.gapas-icerik li { margin-bottom: 10px; }

.gapas-icerik.gapas-icerik a {
	color: var(--g-vurgu);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Aidat tarifesi bu sayfada da tablo stilini kullanır. */
.gapas-tarife { margin: 0 0 20px; }

.gapas-icerik .gapas-tablo-fe {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}
.gapas-icerik .gapas-tablo-fe th,
.gapas-icerik .gapas-tablo-fe td {
	padding: 11px 14px;
	text-align: left;
	border-bottom: 1px solid var(--g-cizgi-acik);
}
.gapas-icerik .gapas-tablo-fe th {
	color: var(--g-soluk);
	font-size: 11.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	border-bottom-color: var(--g-cizgi);
}
.gapas-icerik .gapas-tablo-fe td.sag,
.gapas-icerik .gapas-tablo-fe th.sag { text-align: right; font-variant-numeric: tabular-nums; }
.gapas-icerik .gapas-tablo-fe tbody tr:last-child td { border-bottom: 0; }

.gapas-icerik .gapas-sarmal-fe { overflow-x: auto; }

.gapas-icerik .gapas-not {
	padding: 14px 18px;
	margin: 0 0 20px;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-left: 3px solid var(--g-vurgu);
	border-radius: var(--g-r-s);
}
.gapas-icerik .gapas-not p:last-child { margin-bottom: 0; }

.gapas-icerik .gapas-ipucu {
	display: block;
	margin-top: 8px;
	color: var(--g-soluk);
	font-size: 13.5px;
	line-height: 1.6;
}

@media (max-width: 640px) {
	.gapas-icerik { font-size: 15.5px; }
	.gapas-icerik.gapas-icerik h2 { font-size: 21px; margin-top: 34px; }
}

/*
 * ═══════════════════════════════════════════════ FORM IZGARASI
 *
 * SORUN NEYDİ
 *
 * Alanlar iki farklı yapıda basılıyordu: başvuru formunda
 * <div><label></label><input></div>, panel profilinde ise girdi
 * <label> ETİKETİNİN İÇİNDE. Tema `label` öğesini satır içi
 * biçimlendirdiği için ikinci yapıda her alan bir sonrakinin yanına
 * akıyor, uzun metin kutusu satırın ortasında yukarı kayıyordu —
 * telefon, web sitesi ve tanıtım metni birbirine girmişti.
 *
 * Artık tek yapı var (Gapas_Frontend::alan_girdisi) ve yerleşimi ızgara
 * belirliyor. Etiket kuralları kök sınıfla çift kapsamlı; tema hangi
 * özgüllükle yazarsa yazsın buraya giremiyor.
 */

.gapas-alan-izgara {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 4px 20px;
	align-items: start;
}

/* Uzun metin ve çoklu seçim satırın tamamını kaplar. */
.gapas-alan-izgara .gapas-form-alan.g-genis { grid-column: 1 / -1; }

.gapas-panel.gapas-panel .gapas-form-alan,
.gapas-basvuru.gapas-basvuru .gapas-form-alan {
	display: flex;
	flex-direction: column;
	margin: 0 0 18px;
	min-width: 0;
}

/* Etiket her zaman blok ve girdinin ÜSTÜNDE. */
.gapas-panel.gapas-panel .gapas-etiket,
.gapas-basvuru.gapas-basvuru .gapas-etiket {
	display: block;
	width: auto;
	float: none;
	margin: 0 0 6px;
	padding: 0;
	color: var(--g-metin);
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.4;
	text-align: left;
	text-transform: none;
	letter-spacing: normal;
}

/* Yardım metni etiketle girdi arasında; girdiye aria ile bağlı. */
.gapas-panel.gapas-panel .gapas-form-alan .gapas-ipucu,
.gapas-basvuru.gapas-basvuru .gapas-form-alan .gapas-ipucu {
	order: -1;
	margin: -2px 0 7px;
	font-size: 12.5px;
}

.gapas-panel.gapas-panel .gapas-form-alan input,
.gapas-panel.gapas-panel .gapas-form-alan select,
.gapas-panel.gapas-panel .gapas-form-alan textarea,
.gapas-basvuru.gapas-basvuru .gapas-form-alan input,
.gapas-basvuru.gapas-basvuru .gapas-form-alan select,
.gapas-basvuru.gapas-basvuru .gapas-form-alan textarea {
	width: 100%;
	max-width: none;
	margin: 0;
	float: none;
	display: block;
}

.gapas-panel.gapas-panel .gapas-form-alan textarea,
.gapas-basvuru.gapas-basvuru .gapas-form-alan textarea {
	min-height: 118px;
	resize: vertical;
	line-height: 1.6;
}

.gapas-panel.gapas-panel .gapas-form-alan select[multiple],
.gapas-basvuru.gapas-basvuru .gapas-form-alan select[multiple] {
	min-height: 118px;
	padding: 6px;
}

/* Onay kutulu alanda blok etiket gereksiz; metin kutunun yanında. */
.gapas-form-alan:has( > .gapas-onay ) > .gapas-etiket { display: none; }

.gapas-panel.gapas-panel .gapas-form-alan .gapas-onay,
.gapas-basvuru.gapas-basvuru .gapas-form-alan .gapas-onay {
	margin: 4px 0 0;
	font-weight: 400;
}
.gapas-form-alan .gapas-onay input[type="checkbox"] { width: auto; display: inline-block; }

/* Salt okunur değer, girdi kutusuyla aynı yüksekliği tutsun ki
   ızgarada yan yana duran alanlar hizasını kaybetmesin. */
.gapas-salt-okunur {
	padding: 10px 12px;
	background: var(--g-yuzey);
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	color: var(--g-soft);
	font-size: 15px;
	word-break: break-word;
}

@media (max-width: 640px) {
	.gapas-alan-izgara { grid-template-columns: 1fr; gap: 0; }
}

/* Havale hesap kartında ek satırlar ve ödeme referansı */
.gapas-hesap__satir { display: block; font-size: 13px; }
.gapas-hesap__satir em { color: var(--g-metin-soft); font-style: normal; }
.gapas-hesap__referans {
	display: block;
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px dashed var(--g-cizgi);
	font-size: 13px;
}
.gapas-hesap__referans em { color: var(--g-metin-soft); font-style: normal; }

/* Profil paylaşımı: QR + PNG indir + okunabilir adres */
.gapas-paylas__qr-sar {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
}
.gapas-paylas__indir {
	font-size: 12px;
	color: var(--g-vurgu);
	text-decoration: none;
	border: 1px solid var(--g-cizgi);
	border-radius: var(--g-r-s);
	padding: 3px 10px;
	white-space: nowrap;
}
.gapas-paylas__indir:hover { background: var(--g-yuzey); }
a.gapas-paylas__adres {
	display: inline-block;
	word-break: break-all;
	color: var(--g-vurgu);
	text-decoration: none;
}
a.gapas-paylas__adres:hover { text-decoration: underline; }

/* Profil paylaşım butonları (WhatsApp / X / Telegram / e-posta) */
.gapas-paylas__butonlar {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 12px 0 4px;
}
.gapas-paylas__buton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	color: #fff;
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	transition: transform .1s ease, filter .1s ease, box-shadow .1s ease;
}
/*
 * İkon rengi doğrudan `fill` ile veriliyor. currentColor'a bırakırsak panelin
 * `a` renk kuralı (daha yüksek özgüllük) ikonu koyu yapar; siyah X butonunda
 * koyu ikon görünmez olur. CSS `fill`, SVG'deki fill="currentColor" özniteliğini
 * ezer, o yüzden burada zorlamak güvenli.
 */
.gapas-paylas__buton svg { width: 20px; height: 20px; display: block; fill: #fff; }
.gapas-paylas__buton.g-native svg { fill: var(--g-metin); }
/* <button> öğesi tema/WP düğme stillerini almasın (yuvarlak kalsın). */
button.gapas-paylas__buton { padding: 0; font: inherit; -webkit-appearance: none; appearance: none; box-shadow: none; }
.gapas-paylas__buton.g-whatsapp { background: #25d366; }
.gapas-paylas__buton.g-x        { background: #000; }
.gapas-paylas__buton.g-telegram { background: #29a9eb; }
.gapas-paylas__buton.g-eposta   { background: var(--g-vurgu); }
.gapas-paylas__buton.g-native   { background: var(--g-yuzey); color: var(--g-metin); border-color: var(--g-cizgi); }
.gapas-paylas__buton:hover {
	transform: translateY(-1px);
	filter: brightness(1.06);
	box-shadow: 0 3px 8px -3px rgba(28,26,22,.4);
	text-decoration: none;
}
.gapas-paylas__buton.g-native:hover { filter: none; background: var(--g-cizgi-acik); }
.gapas-paylas__eposta { margin-top: 12px; }

/* ==================================================================
 * Üyelikten ayrılma — üç adımlı doğrulama (şifre → kod → gerekçe)
 * ================================================================== */
.gapas-iptal { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--g-cizgi, #e3dfd5); }
.gapas-iptal__akis[hidden] { display: none; }
.gapas-iptal__akis {
	margin-top: 12px;
	padding: 16px;
	background: var(--g-yuzey, #fbfaf7);
	border: 1px solid var(--g-cizgi, #e3dfd5);
	border-radius: var(--g-r, 6px);
}
.gapas-iptal__adimlar {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 14px;
	padding: 0;
	list-style: none;
	counter-reset: gapas-iptal-adim;
}
.gapas-iptal__adimlar li {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--g-soluk, #756e60);
}
.gapas-iptal__adimlar li::before {
	counter-increment: gapas-iptal-adim;
	content: counter(gapas-iptal-adim);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 1px solid currentColor;
	font-size: 11px;
}
.gapas-iptal__adimlar li + li::after { content: ""; }
.gapas-iptal__adimlar li.g-aktif { color: var(--g-vurgu, #8a6710); }
.gapas-iptal__adimlar li.g-bitti { color: var(--g-iyi, #2a6a2a); }
.gapas-iptal__adimlar li.g-bitti::before { content: "✓"; border-color: currentColor; }
.gapas-iptal__adim[hidden] { display: none; }
.gapas-iptal__adim label { display: block; font-weight: 600; font-size: 13px; margin-bottom: 5px; }
.gapas-iptal__adim input[type="password"],
.gapas-iptal__adim input[type="text"] {
	width: 100%;
	max-width: 280px;
	box-sizing: border-box;
	margin-bottom: 6px;
}
.gapas-iptal__kod {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 20px;
	letter-spacing: .32em;
	text-align: center;
	max-width: 190px !important;
}
.gapas-iptal__mesaj {
	margin: 12px 0 0;
	padding: 9px 12px;
	border-radius: var(--g-r-s, 4px);
	font-size: 13px;
	line-height: 1.55;
	background: var(--g-yuzey, #f3f1ec);
}
.gapas-iptal__mesaj.g-iyi { background: var(--g-iyi-zemin, #eaf3e8); color: var(--g-iyi, #2a6a2a); }
.gapas-iptal__mesaj.g-hata { background: var(--g-kritik-zemin, #f9e9e4); color: var(--g-kritik, #96341f); }
.gapas-iptal__mesaj[hidden] { display: none; }
.gapas-baglanti-dugme {
	appearance: none;
	background: none;
	border: 0;
	padding: 0;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--g-soluk, #756e60);
	text-decoration: underline;
	cursor: pointer;
}
.gapas-baglanti-dugme:hover { color: var(--g-vurgu, #8a6710); }

/* ============================================================ KURULLAR SAYFASI
 *
 * Başlıklar artık sayfanın içine elle yazılmıyor, kısayod basıyor. Başkan
 * kendi bölümünde tek kart olarak, ortalanmış duruyor; diğer kurullar
 * ızgarada.
 */
.gapas-kurullar { display: block; }

.gapas-kurul-bolum { margin: 0 0 42px; }
.gapas-kurul-bolum:last-child { margin-bottom: 0; }

.gapas-kurul-bolum__baslik {
	margin: 0 0 20px;
	text-align: center;
	font-size: 22px;
	line-height: 1.25;
	color: var(--g-metin, #1c1a16);
}

/* Başkan: tek kart, ortada ve biraz daha geniş. */
.gapas-kurul--tekli {
	display: flex;
	justify-content: center;
}
.gapas-kurul--tekli .gapas-kurul__kisi {
	width: 100%;
	max-width: 280px;
}
.gapas-kurul--tekli .gapas-kurul__kisi img {
	width: 110px;
	height: 110px;
}

/*
 * Kartın tamamı tıklanabilir.
 *
 * Profili açık üyede <a>, kapalı üyede <button> basılıyor ve ikisi BİREBİR
 * aynı görünmeli. Tema, içerik alanındaki düğmelere kendi altın çerçevesini
 * ve dolgusunu veriyordu: sonuç, kartın içinde ikinci bir çerçeve ve
 * yalnızca düğmeli kartlarda aşağı kayan bir hizaydı. Sınıf adı iki kez
 * yazılarak (0,2,1) temanın kuralının üstüne çıkılıyor; !important'a gerek
 * kalmıyor.
 */
.gapas-kurul.gapas-kurul .gapas-kurul__kart,
.gapas-kurul.gapas-kurul .gapas-kurul__kart:hover,
.gapas-kurul.gapas-kurul .gapas-kurul__kart:focus,
.gapas-kurul.gapas-kurul .gapas-kurul__kart:active {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	height: 100%;
	min-height: 0;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	text-shadow: none;
	font: inherit;
	line-height: inherit;
	letter-spacing: normal;
	text-transform: none;
	color: inherit;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.gapas-kurul.gapas-kurul .gapas-kurul__kart:focus-visible {
	outline: 2px solid var(--g-vurgu, #8a6710);
	outline-offset: 4px;
}

/*
 * Kartlar eşit yükseklikte ve içerikleri aynı hizada olsun.
 *
 * Izgara kartları zaten aynı boya çekiyor ama içerik yukarıdan akıyordu;
 * adı iki satıra taşan kişide unvan aşağıda, tek satırlıkta yukarıda
 * kalıyordu. Ad bloğu esneyip boşluğu yuttuğu için unvan hepsinde kartın
 * altına hizalanıyor.
 */
.gapas-kurul.gapas-kurul .gapas-kurul__kisi {
	display: flex;
	flex-direction: column;
}
.gapas-kurul.gapas-kurul .gapas-kurul__kart h3 {
	margin: 0 0 8px;
	text-wrap: balance;
}
.gapas-kurul.gapas-kurul .gapas-kurul__kart .gapas-kurul__unvan {
	margin-top: auto;
}
.gapas-kurul.gapas-kurul .gapas-kurul__kisi:hover .gapas-kurul__kart h3 {
	color: var(--g-vurgu, #8a6710);
}

/* Ekran okuyucuya bağlantının ne yaptığını söyleyen gizli metin. */
.gapas-kurul .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

@media (max-width: 480px) {
	.gapas-kurul-bolum__baslik { font-size: 19px; }
}