/* Benzer ayetler ve tefsir */

:root,
[data-bs-theme="light"] {
  --k-tefsir-yesil: #16a34a;
  --k-tefsir-kahve: #92400e;
  --k-tefsir-mavi: #2563eb;
}

[data-bs-theme="dark"] {
  --k-tefsir-yesil: #4ade80;
  --k-tefsir-kahve: #fbbf24;
  --k-tefsir-mavi: #93c5fd;
}

/* ---------- Benzer ayetler ---------- */

/* Ortak parça renkleri: aynı parça seçilen ayette ve bulunan ayette aynı renkte (iki temada da okunur tonlar) */
.benzer-1 { color: #22a55a; }
.benzer-2 { color: #4f6ef7; }
.benzer-3 { color: #c850e6; }
.benzer-4 { color: #e38b06; }
.benzer-5 { color: #0fa69a; }
.benzer-6 { color: #dc2626; }

[data-bs-theme="dark"] .benzer-1 { color: #7cdb5a; }
[data-bs-theme="dark"] .benzer-2 { color: #8ea2ff; }
[data-bs-theme="dark"] .benzer-3 { color: #e59af8; }
[data-bs-theme="dark"] .benzer-4 { color: #fbbf24; }
[data-bs-theme="dark"] .benzer-5 { color: #2dd4bf; }
[data-bs-theme="dark"] .benzer-6 { color: #f87171; }

.benzer-aciklama {
  color: var(--k-yazi-soluk);
  font-size: 15px;
}

.benzer-filtre {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
}

.benzer-filtre .form-select {
  width: auto;
  min-width: 240px;
}

.benzer-bilgi {
  font-size: 14px;
  color: var(--k-yazi-soluk);
  margin-bottom: 8px;
}

/* ---------- Tefsir ---------- */
.tefsir-ayetleri {
  font-family: "MyArabic", "Amiri", serif;
  font-size: clamp(26px, 3vw, 34px);
  line-height: 2.1;
  text-align: center;
}

.tefsir-ayet-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0 10px;
  border-radius: 50%;
  border: 1px solid var(--k-kenar-belirgin);
  background: var(--k-yuzey);
  color: var(--k-yazi-orta);
  font-family: Calibri, "Segoe UI", Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  vertical-align: middle;
}

.tefsir-html {
  font-size: clamp(17px, 1.2vw, 21px);
  line-height: 2.1;
}

.tefsir-html p {
  margin-bottom: 14px;
}

.tefsir-html .tr {
  direction: ltr;
  text-align: left;
}

.tefsir-html .green { color: var(--k-tefsir-yesil); }
.tefsir-html .brown { color: var(--k-tefsir-kahve); font-weight: 700; }
.tefsir-html .blue { color: var(--k-tefsir-mavi); }