/*
 * Kategori şablonu (durum, sure, dua eden, hitap, tüm dualar).
 * Kaynak: docs/mockups/yeni/d-kategori.html, d-kategori-uzun.html.
 */

/* ============ Giriş metni ============ */
.intro p { margin: 0 0 1rem; color: var(--ink-2); font-size: 1.03rem; line-height: 1.8; }
.intro p:nth-of-type(n+2) { display: none; }
.intro.open p { display: block; }
.intro .more {
	display: inline-flex; align-items: center; min-height: 2.75rem;
	font-weight: 600; font-size: .9rem; color: var(--vurgu);
}
.intro .more:hover { text-decoration: underline; }
.intro.open .more { display: none; }

/* ============ Öne çıkan dua ============ */
.feat {
	display: grid; grid-template-columns: 1fr 1fr; margin-top: 2rem; text-decoration: none;
	background: var(--card); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden;
	transition: transform .15s;
}
.feat.tek { grid-template-columns: 1fr; }
.feat:hover { transform: translateY(-2px); }
.feat .ar-panel { display: grid; place-items: center; padding: 2rem 1.5rem; }
.feat .ar { font-size: 1.75rem; line-height: 2; }
.feat .info { display: flex; flex-direction: column; padding: 1.5rem 1.6rem; }
.feat .lab { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-text); }
.feat .t { font-family: var(--display); font-weight: 600; font-size: 1.65rem; line-height: 1.15; color: var(--baslik); margin: .35rem 0 .5rem; }
.feat .m { font-size: .93rem; color: var(--ink-2); }
.feat .r { margin-top: .75rem; font-size: .82rem; color: var(--muted); }
.feat .go { margin-top: auto; padding-top: 1rem; font-weight: 600; font-size: .9rem; color: var(--vurgu); }

/* ============ Liste, filtre, sıralama ============ */
.kd-kat section { margin-top: 3rem; }
.tools { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; }
.tools h2 { margin: 0; }
.sort { display: flex; align-items: center; gap: .5rem; font-size: .85rem; color: var(--muted); }
.sort select {
	min-height: 2.75rem; border: 1px solid var(--line); border-radius: 10px; background: var(--card);
	padding: 0 .75rem; font-size: .86rem; font-weight: 600; color: var(--ink-2);
}
.filters { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .75rem; }
.filters button {
	display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; padding: 0 .95rem;
	border-radius: 999px; background: var(--card); border: 1px solid var(--line);
	font-size: .86rem; font-weight: 600; color: var(--ink-2); white-space: nowrap;
}
.filters button span { font-size: .75rem; color: var(--muted); font-weight: 600; }
.filters button:hover { border-color: var(--gold); }
.filters button[aria-pressed="true"] { background: var(--green-deep); border-color: var(--green-deep); color: #fff; }
.filters button[aria-pressed="true"] span { color: #E9DDBF; } /* koyu yeşil zeminde, her iki modda aynı */
.count { margin: 0 0 .75rem; font-size: .84rem; color: var(--muted); }
.bos { color: var(--muted); }

/* ============ Mobil ============ */
@media (max-width: 640px) {
	.feat { grid-template-columns: 1fr; }
	.feat .ar-panel { padding: 1.75rem 1.1rem; }
	.feat .info { padding: 1.2rem 1.1rem; }
	.sort span { display: none; }
	.filters {
		flex-wrap: nowrap; overflow-x: auto; margin: 0 -1rem .75rem; padding: 0 1rem 2px;
		scrollbar-width: none;
	}
	.filters button { flex: none; }
}
