/* ==========================================================================
   2. EL PAZARI

   Tekil ilan alışveriş sitelerinin tanıdık yerleşimini izliyor: solda
   fotoğraf, sağda künye. Liste tarafı da aynı dili konuşuyor.
   ========================================================================== */

.yp-pazar,
.yp-ilan,
.yp-form-sayfasi {
	--yp-yesil: #16a34a;
	--yp-lacivert: #0f172a;
	--yp-cizgi: #e2e8f0;
	--yp-soluk: #64748b;
}

/* --- Liste başlığı --- */

.yp-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding: 30px 32px;
	margin-bottom: 22px;
	border-radius: 20px;
	background: linear-gradient( 135deg, #0b3b2e 0%, #16a34a 100% );
	color: #fff;
}

.yp-hero-etiket {
	display: inline-block;
	margin-bottom: 10px;
	font-size: 12.5px;
	letter-spacing: .22em;
	font-weight: 700;
	opacity: .85;
}

.yp-hero h1 {
	margin: 0 0 10px;
	font-size: 30px;
	line-height: 1.2;
	color: #fff;
}

.yp-hero p {
	margin: 0;
	max-width: 620px;
	font-size: 15.5px;
	line-height: 1.6;
	color: rgba( 255, 255, 255, .9 );
}

.yp-hero-aksiyon {
	text-align: center;
}

.yp-hero-not {
	display: block;
	margin-top: 8px;
	font-size: 12.5px;
	color: rgba( 255, 255, 255, .82 );
}

/* --- Düğmeler --- */

.yp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 13px 24px;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: 14.5px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none !important;
	cursor: pointer;
	transition: background .16s ease;
}

.yp-btn-ana {
	background: #fff;
	color: #0b3b2e !important;
}

.yp-hero .yp-btn-ana:hover {
	background: #ecfdf5;
}

.yp-form-sayfasi .yp-btn-ana,
.yp-bos .yp-btn-ana {
	background: var(--yp-yesil);
	color: #fff !important;
}

.yp-btn-cizgi {
	background: #fff;
	color: var(--yp-lacivert) !important;
	border-color: #cbd5e1;
}

.yp-btn-wa {
	background: #25d366;
	color: #06301a !important;
}

.yp-btn-soru {
	background: var(--yp-lacivert);
	color: #fff !important;
}

/* --- Süzgeç --- */

.yp-suzgec {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding: 14px;
	margin-bottom: 18px;
	background: #f8fafc;
	border: 1px solid var(--yp-cizgi);
	border-radius: 16px;
}

.yp-suzgec input,
.yp-suzgec select {
	flex: 1 1 150px;
	min-width: 0;
	padding: 11px 13px;
	border: 1px solid var(--yp-cizgi);
	border-radius: 10px;
	font-size: 14px;
	background: #fff;
}

.yp-suzgec input[type="search"] {
	flex: 3 1 260px;
}

.yp-suzgec button {
	flex: 0 0 auto;
	padding: 11px 26px;
	border: 0;
	border-radius: 10px;
	background: var(--yp-yesil);
	color: #fff;
	font-weight: 700;
	cursor: pointer;
}

.yp-sonuc-sayisi {
	margin: 0 0 12px;
	font-size: 13.5px;
	color: var(--yp-soluk);
}

/* --- Izgara ve kart --- */

.yp-izgara {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 220px, 1fr ) );
	gap: 16px;
}

.yp-kart-ilan {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--yp-cizgi);
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none !important;
	color: inherit !important;
	transition: transform .18s ease, box-shadow .18s ease;
}

.yp-kart-ilan:hover {
	transform: translateY( -3px );
	box-shadow: 0 14px 30px rgba( 15, 23, 42, .1 );
}

.yp-kart-gorsel {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	background: #f1f5f9;
	overflow: hidden;
}

.yp-kart-gorsel img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.yp-kart-gorsel-yok {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-size: 13px;
	color: #94a3b8;
}

.yp-kart-satildi-etiket {
	position: absolute;
	top: 10px;
	left: 10px;
	padding: 5px 12px;
	border-radius: 999px;
	background: #b91c1c;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
}

.yp-kart-govde {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 13px 14px 15px;
}

.yp-kart-baslik {
	font-size: 15px;
	line-height: 1.35;
	font-weight: 700;
	color: var(--yp-lacivert);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.yp-kart-fiyat {
	font-size: 18px;
	font-weight: 800;
	color: var(--yp-yesil);
}

.yp-kart-alt {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	font-size: 12px;
	color: var(--yp-soluk);
}

.yp-kart-alt span:not(:last-child)::after {
	content: '·';
	margin-left: 8px;
}

.yp-kart-satildi .yp-kart-gorsel img {
	filter: grayscale( .85 );
}

/* --- Tekil ilan --- */

.yp-ilan-ust {
	display: grid;
	grid-template-columns: minmax( 0, 1.05fr ) minmax( 0, .95fr );
	gap: 28px;
	align-items: start;
	margin-bottom: 26px;
}

.yp-ana-gorsel {
	display: block;
	width: 100%;
	padding: 0;
	border: 1px solid var(--yp-cizgi);
	border-radius: 18px;
	overflow: hidden;
	background: #f8fafc;
	position: relative;
	cursor: zoom-in;
	line-height: 0;
}

.yp-ana-gorsel img {
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.yp-satildi-serit {
	position: absolute;
	top: 18px;
	left: -42px;
	width: 170px;
	padding: 7px 0;
	transform: rotate( -38deg );
	background: #b91c1c;
	color: #fff;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .14em;
	text-align: center;
	line-height: 1.4;
}

.yp-kucuk-gorseller {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 10px;
	margin-top: 10px;
}

.yp-kucuk-gorseller .yk-gallery-card {
	border: 1px solid var(--yp-cizgi);
	border-radius: 12px;
	overflow: hidden;
	background: #f8fafc;
	padding: 0;
	cursor: zoom-in;
	line-height: 0;
}

.yp-kucuk-gorseller img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
}

.yp-gorsel-yok {
	padding: 60px 20px;
	text-align: center;
	color: #94a3b8;
	background: #f8fafc;
	border: 1px dashed var(--yp-cizgi);
	border-radius: 18px;
}

/* --- Künye --- */

.yp-kategori-etiket {
	display: inline-block;
	margin-bottom: 10px;
	padding: 5px 14px;
	border-radius: 999px;
	background: #ecfdf5;
	color: #047857 !important;
	font-size: 12.5px;
	font-weight: 700;
	text-decoration: none !important;
}

.yp-baslik {
	margin: 0 0 14px;
	font-size: 27px;
	line-height: 1.25;
	color: var(--yp-lacivert);
}

.yp-fiyat-satiri {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	padding-bottom: 16px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--yp-cizgi);
}

.yp-fiyat {
	font-size: 30px;
	font-weight: 800;
	color: var(--yp-yesil);
}

.yp-rozet {
	padding: 5px 12px;
	border-radius: 999px;
	background: #f1f5f9;
	color: #334155;
	font-size: 12.5px;
	font-weight: 600;
}

.yp-ozellikler {
	list-style: none;
	margin: 0 0 18px;
	padding: 0;
	display: grid;
	gap: 9px;
}

.yp-ozellikler li {
	display: flex;
	justify-content: space-between;
	gap: 14px;
	font-size: 14.5px;
	padding-bottom: 9px;
	border-bottom: 1px dashed #eef2f7;
}

.yp-ozellikler span {
	color: var(--yp-soluk);
}

.yp-ozellikler strong {
	color: var(--yp-lacivert);
	text-align: right;
}

.yp-satici {
	padding: 14px 16px;
	margin-bottom: 16px;
	background: #f8fafc;
	border: 1px solid var(--yp-cizgi);
	border-radius: 14px;
}

.yp-satici-etiket {
	display: block;
	font-size: 11.5px;
	letter-spacing: .14em;
	font-weight: 700;
	color: var(--yp-soluk);
	margin-bottom: 4px;
}

.yp-satici-ad {
	font-size: 16px;
	font-weight: 700;
	color: var(--yp-lacivert) !important;
}

.yp-iletisim {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 16px;
}

.yp-iletisim .yp-btn {
	flex: 1 1 160px;
}

.yp-guvenlik {
	margin: 0;
	padding: 12px 14px;
	background: #fff7ed;
	border-left: 3px solid #f59e0b;
	border-radius: 10px;
	font-size: 13px;
	line-height: 1.55;
	color: #7c2d12;
}

.yp-satildi-not {
	margin: 0 0 16px;
	padding: 11px 14px;
	background: #fef2f2;
	border-radius: 10px;
	color: #991b1b;
	font-weight: 600;
}

/* --- Alt bölümler --- */

.yp-kart {
	padding: 22px 24px;
	margin-bottom: 18px;
	background: #fff;
	border: 1px solid var(--yp-cizgi);
	border-radius: 18px;
}

.yp-kart h2 {
	margin: 0 0 14px;
	font-size: 20px;
	color: var(--yp-lacivert);
}

/* --- Form --- */

.yp-form label {
	display: block;
	margin-bottom: 14px;
	font-size: 14px;
	font-weight: 600;
	color: var(--yp-lacivert);
}

/*
 * Yazı boyutu 16 pikselin altına DÜŞMÜYOR: iPhone, 16'dan küçük bir
 * alana dokunulduğunda sayfayı kendiliğinden büyütüyor ve kişi form
 * doldururken ekranı kaydırmak zorunda kalıyordu.
 */
.yp-form input[type="text"],
.yp-form input[type="number"],
.yp-form input[type="tel"],
.yp-form input[type="file"],
.yp-form select,
.yp-form textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-top: 6px;
	min-height: 48px;
	padding: 12px 13px;
	border: 1px solid var(--yp-cizgi);
	border-radius: 10px;
	font-size: 16px;
	font-weight: 400;
	background: #fff;
}

.yp-form textarea {
	min-height: 120px;
	line-height: 1.5;
}

/* Dosya seçme alanı düğme gibi dursun — dokunma hedefi büyüsün. */
.yp-form input[type="file"] {
	padding: 14px 13px;
	background: #f8fafc;
	border-style: dashed;
	border-width: 2px;
}

.yp-foto-alan {
	margin-bottom: 8px;
}

/* Onay kutuları da parmakla rahat seçilsin. */
.yp-form .yp-onay {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	font-size: 15px;
}

.yp-form .yp-onay input[type="checkbox"] {
	width: 20px;
	height: 20px;
}

.yp-form-satir {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

.yp-onaylar {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
	margin-bottom: 14px;
}

.yp-onay {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	margin: 0 !important;
	font-weight: 500 !important;
}

.yp-gorsel-kutusu {
	margin: 0 0 16px;
	padding: 16px 18px;
	border: 1px solid var(--yp-cizgi);
	border-radius: 14px;
}

.yp-gorsel-kutusu legend {
	padding: 0 8px;
	font-weight: 700;
	color: var(--yp-lacivert);
}

.yp-ipucu,
.yp-kural,
.yp-hak-notu {
	font-size: 13px;
	line-height: 1.55;
	color: var(--yp-soluk);
}

.yp-kural {
	padding: 11px 14px;
	background: #f8fafc;
	border-radius: 10px;
}

.yp-uyari {
	padding: 18px 20px;
	margin-bottom: 18px;
	background: #f8fafc;
	border: 1px solid var(--yp-cizgi);
	border-radius: 14px;
}

.yp-uyari h3 {
	margin: 0 0 8px;
	font-size: 18px;
}

.yp-uyari-yesil {
	background: #f0fdf4;
	border-color: #86efac;
}

.yp-uyari-kirmizi {
	background: #fef2f2;
	border-color: #fecaca;
}

/* --- İlanlarım --- */

.yp-ilanlarim {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.yp-ilanim {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding: 12px 14px;
	background: #f8fafc;
	border: 1px solid var(--yp-cizgi);
	border-radius: 12px;
}

.yp-ilanim-pasif {
	opacity: .68;
}

.yp-ilanim-ad {
	font-weight: 700;
	color: var(--yp-lacivert) !important;
	text-decoration: none !important;
}

.yp-ilanim-durum {
	font-size: 12.5px;
	color: var(--yp-soluk);
}

.yp-ilanim-islem {
	display: flex;
	gap: 14px;
	font-size: 13px;
}

.yp-ilanim-islem a {
	color: #0f766e !important;
}

.yp-tehlike {
	color: #b91c1c !important;
}

/* --- Boş durum ve sayfalama --- */

.yp-bos {
	padding: 44px 24px;
	text-align: center;
	background: #f8fafc;
	border: 1px dashed var(--yp-cizgi);
	border-radius: 18px;
}

.yp-sayfalama {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 22px;
}

.yp-sayfalama .page-numbers {
	padding: 9px 15px;
	border: 1px solid var(--yp-cizgi);
	border-radius: 10px;
	text-decoration: none;
	color: var(--yp-lacivert);
	background: #fff;
}

.yp-sayfalama .current {
	background: var(--yp-yesil);
	border-color: var(--yp-yesil);
	color: #fff;
}

/* --- Mobil --- */

@media ( max-width: 900px ) {
	.yp-ilan-ust {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.yp-hero {
		padding: 24px 20px;
	}

	.yp-hero h1 {
		font-size: 24px;
	}

	.yp-baslik {
		font-size: 22px;
	}

	.yp-fiyat {
		font-size: 26px;
	}

	.yp-form-satir {
		grid-template-columns: 1fr;
	}

	/*
	 * "İlanı Yayınla" düğmesi telefonda ekranın altına yapışıyor.
	 * Uzun formda düğmeyi görmek için sonuna kadar kaydırmak
	 * gerekiyordu; kişi formu doldurup orada bırakıyordu.
	 */
	.yp-form .yp-btn-ana {
		position: sticky;
		bottom: 10px;
		width: 100%;
		min-height: 54px;
		font-size: 17px;
		box-shadow: 0 10px 26px -10px rgba( 15, 23, 42, .45 );
	}

	.yp-izgara {
		grid-template-columns: repeat( auto-fill, minmax( 150px, 1fr ) );
		gap: 12px;
	}
}

/* ==========================================================================
   SORU & CEVAP
   ========================================================================== */

.yp-sorular h2 {
	display: flex;
	align-items: center;
	gap: 10px;
}

.yp-soru-sayisi {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 26px;
	height: 26px;
	padding: 0 8px;
	border-radius: 999px;
	background: #ecfdf5;
	color: #047857;
	font-size: 13px;
	font-weight: 700;
}

.yp-soru-aciklama {
	margin: 0 0 16px;
	font-size: 13px;
	color: var(--yp-soluk);
}

.yp-soru-listesi {
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.yp-soru-satiri {
	padding: 13px 15px;
	background: #f8fafc;
	border: 1px solid var(--yp-cizgi);
	border-radius: 12px;
}

.yp-soru-satiri p {
	margin: 6px 0 0;
	font-size: 14.5px;
	line-height: 1.55;
	color: #1e293b;
}

.yp-soru-satici {
	background: #f0fdf4;
	border-color: #bbf7d0;
	margin-left: 26px;
}

.yp-soru-basi {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 9px;
	font-size: 13.5px;
}

.yp-satici-rozet {
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--yp-yesil);
	color: #fff;
	font-size: 11.5px;
	font-weight: 700;
}

.yp-soru-tarih {
	margin-left: auto;
	font-size: 12px;
	color: var(--yp-soluk);
}

.yp-soru-bos,
.yp-soru-giris {
	padding: 16px;
	background: #f8fafc;
	border-radius: 12px;
	font-size: 14px;
	color: var(--yp-soluk);
}

.yp-soru-formu textarea,
.yp-soru textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--yp-cizgi);
	border-radius: 12px;
	font-size: 14.5px;
	font-family: inherit;
	resize: vertical;
}

.yp-soru-formu .comment-reply-title {
	font-size: 16px;
	margin: 0 0 10px;
}

.yp-soru-formu .form-submit {
	margin: 12px 0 0;
}

/* --- Özel mesaj kutusu --- */

.yp-soru {
	margin: 0 0 16px;
	padding: 16px 18px;
	background: #f8fafc;
	border: 1px solid var(--yp-cizgi);
	border-radius: 14px;
}

.yp-soru h3 {
	margin: 0 0 8px;
	font-size: 17px;
}

.yp-soru-not {
	margin: 0 0 12px;
	font-size: 13px;
	line-height: 1.55;
	color: var(--yp-soluk);
}

.yp-hazir-sorular {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin-bottom: 10px;
}

.yp-hazir {
	padding: 7px 13px;
	border: 1px solid var(--yp-cizgi);
	border-radius: 999px;
	background: #fff;
	font-size: 12.5px;
	color: #334155;
	cursor: pointer;
}

.yp-hazir:hover {
	border-color: var(--yp-yesil);
	color: #047857;
}

.yp-soru form button[type="submit"] {
	margin-top: 10px;
}

/* ==========================================================================
   KATEGORİLER VE NASIL ÇALIŞIR
   ========================================================================== */

.yp-kategoriler,
.yp-nasil {
	margin-bottom: 22px;
}

.yp-kategoriler h2,
.yp-nasil h2 {
	margin: 0 0 14px;
	font-size: 20px;
	color: var(--yp-lacivert);
}

.yp-kategori-izgara {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 250px, 1fr ) );
	gap: 12px;
}

.yp-kategori-kutu {
	padding: 14px 16px;
	background: #fff;
	border: 1px solid var(--yp-cizgi);
	border-radius: 14px;
}

.yp-kategori-secili {
	border-color: var(--yp-yesil);
	background: #f0fdf4;
}

.yp-kategori-ust {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 700;
	color: var(--yp-lacivert) !important;
	text-decoration: none !important;
}

.yp-kategori-ust span {
	padding: 2px 8px;
	border-radius: 999px;
	background: #ecfdf5;
	color: #047857;
	font-size: 11.5px;
}

.yp-kategori-alt {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 9px;
}

.yp-kategori-alt a {
	padding: 5px 11px;
	border-radius: 999px;
	background: #f1f5f9;
	color: #475569 !important;
	font-size: 12.5px;
	text-decoration: none !important;
}

.yp-kategori-alt a:hover {
	background: var(--yp-yesil);
	color: #fff !important;
}

.yp-nasil-izgara {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 230px, 1fr ) );
	gap: 14px;
	margin-bottom: 16px;
}

.yp-adim {
	padding: 18px 20px;
	background: #f8fafc;
	border: 1px solid var(--yp-cizgi);
	border-radius: 16px;
}

.yp-adim-no {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin-bottom: 10px;
	border-radius: 50%;
	background: var(--yp-yesil);
	color: #fff;
	font-weight: 800;
	font-size: 14px;
}

.yp-adim strong {
	display: block;
	margin-bottom: 6px;
	font-size: 15.5px;
	color: var(--yp-lacivert);
}

.yp-adim p {
	margin: 0;
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--yp-soluk);
}

.yp-nasil-alt {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 14px;
	padding: 16px 20px;
	background: #0f172a;
	border-radius: 16px;
}

.yp-nasil-alt p {
	margin: 0;
	max-width: 620px;
	font-size: 14px;
	line-height: 1.6;
	color: #cbd5e1;
}

.yp-nasil-alt strong {
	color: #fff;
}

.yp-nasil-alt .yp-btn-ana {
	background: var(--yp-yesil);
	color: #fff !important;
}

/* ==========================================================================
   İLAN VERME FORMU — bölümler ve yardımcı sütun

   Uzun ve beyaz tek bir form yerine numaralı, hafif renkli kutular:
   kişi nerede olduğunu görüyor. Sağdaki sütun hem boşluğu dolduruyor
   hem de en çok takılınan üç şeyi (kalan hak, iyi ilan, yasaklar)
   göz önünde tutuyor.
   ========================================================================== */

.yp-form-duzen {
	display: grid;
	grid-template-columns: minmax( 0, 1.65fr ) minmax( 0, .85fr );
	gap: 20px;
	align-items: start;
}

.yp-bolum {
	position: relative;
	margin: 0 0 18px;
	padding: 22px 20px 8px;
	border: 1px solid var(--yp-cizgi);
	border-radius: 16px;
}

.yp-bolum-baslik {
	position: absolute;
	top: -11px;
	left: 16px;
	padding: 3px 12px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--yp-cizgi);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	color: #334155;
}

.yp-bolum-mavi   { background: #f5f9ff; border-color: #dbeafe; }
.yp-bolum-yesil  { background: #f2fdf6; border-color: #bbf7d0; }
.yp-bolum-sari   { background: #fffbf2; border-color: #fde68a; }
.yp-bolum-mor    { background: #faf7ff; border-color: #e9d5ff; }

.yp-bolum-mavi  .yp-bolum-baslik { color: #1d4ed8; border-color: #dbeafe; }
.yp-bolum-yesil .yp-bolum-baslik { color: #047857; border-color: #bbf7d0; }
.yp-bolum-sari  .yp-bolum-baslik { color: #b45309; border-color: #fde68a; }
.yp-bolum-mor   .yp-bolum-baslik { color: #7e22ce; border-color: #e9d5ff; }

.yp-bolum .yp-form-satir:last-child label:last-child,
.yp-bolum > label:last-child {
	margin-bottom: 14px;
}

.yp-gorsel-kutusu legend {
	position: static;
	display: inline-block;
	margin-left: 0;
	padding: 3px 12px;
}

/* --- Yardımcı sütun --- */

.yp-yan {
	position: sticky;
	top: 90px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.yp-yan-kart {
	padding: 18px 20px;
	background: #fff;
	border: 1px solid var(--yp-cizgi);
	border-radius: 16px;
}

.yp-yan-baslik {
	display: block;
	margin-bottom: 12px;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--yp-yesil);
}

.yp-yan-hak {
	background: linear-gradient( 160deg, #f0fdf4, #fff );
	border-color: #bbf7d0;
}

.yp-hak-satir {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 9px 0;
	border-bottom: 1px dashed #d1fae5;
	font-size: 14px;
	color: #334155;
}

.yp-hak-satir:last-of-type {
	border-bottom: 0;
}

.yp-hak-satir strong {
	font-size: 16px;
	color: #047857;
}

.yp-yan-not {
	margin: 8px 0 0;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--yp-soluk);
}

.yp-yan-liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 11px;
}

.yp-yan-liste li {
	position: relative;
	padding-left: 18px;
	font-size: 13.5px;
	line-height: 1.5;
	color: #475569;
}

.yp-yan-liste li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 7px;
	width: 7px;
	height: 7px;
	background: var(--yp-yesil);
	transform: rotate( 45deg );
}

.yp-yan-liste strong {
	color: var(--yp-lacivert);
}

.yp-yan-kural {
	background: #fff7ed;
	border-color: #fed7aa;
}

.yp-yan-kural .yp-yan-baslik {
	color: #b45309;
}

.yp-yan-kural p {
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
	color: #7c2d12;
}

@media ( max-width: 900px ) {
	.yp-form-duzen {
		grid-template-columns: 1fr;
	}

	.yp-yan {
		position: static;
	}
}

/* ==========================================================================
   PANEL VE PROFİL BÖLÜMLERİ
   ========================================================================== */

.yp-panel-ilan,
.yp-profil-ilan {
	margin: 28px 0;
	padding: 22px;
	background: #fff;
	border: 1px solid var(--yp-cizgi);
	border-radius: 16px;
}

.yp-panel-ilan-ust {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	margin-bottom: 16px;
}

.yp-panel-ilan-ust h2,
.yp-profil-ilan h2 {
	margin: 0 0 4px;
	font-size: 20px;
}

.yp-panel-ilan-ust p {
	margin: 0;
	color: var(--yp-soluk);
	font-size: 14px;
}

.yp-panel-ilan-bos {
	margin: 0;
	padding: 16px 18px;
	background: #f8fafc;
	border-radius: 12px;
	color: var(--yp-soluk);
	font-size: 14.5px;
	line-height: 1.55;
}

.yp-profil-ilan h2 {
	margin-bottom: 14px;
}

.yp-profil-ilan .yp-btn {
	margin-top: 16px;
}
