/* ========================================
   Tajweed Color Coding
   Maps Quran.com v4 API tajweed HTML classes to colors
   Uses CSS custom properties from tokens.css for user customization
   ======================================== */

/* Hamzat al-Wasl — connecting hamza (silent in connected speech) */
.ham_wasl {
  color: var(--tajweed-hamwasl, #aaaaaa);
  opacity: 0.7;
}

/* Lam Shamsiyyah — assimilated lam */
.laam_shamsiyah {
  color: var(--tajweed-laam, #aaaaaa);
  opacity: 0.7;
}

/* Silent letter */
.slnt {
  color: var(--tajweed-silent, #aaaaaa);
  opacity: 0.5;
}

/* Ghunnah — nasalization (2 counts) */
.ghunnah {
  color: var(--tajweed-ghunnah);
}

/* Ikhfa — hiding */
.ikhafa {
  color: var(--tajweed-ikhfa);
}

/* Ikhfa Shafawi */
.ikhafa_shafawi {
  color: var(--tajweed-ikhfa);
}

/* Idgham with Ghunnah — merging with nasalization */
.idgham_ghunnah {
  color: var(--tajweed-idghaam);
}

/* Idgham without Ghunnah */
.idgham_wo_ghunnah {
  color: var(--tajweed-idghaam);
}

/* Idgham Shafawi */
.idgham_shafawi {
  color: var(--tajweed-idghaam);
}

/* Idgham Mutajanisayn */
.idgham_mutajanisayn {
  color: var(--tajweed-idghaam);
}

/* Idgham Mutaqaribayn */
.idgham_mutaqaribayn {
  color: var(--tajweed-idghaam);
}

/* Iqlab — conversion (nun to mim) */
.iqlab {
  color: var(--tajweed-iqlab);
}

/* Qalqalah — echoing bounce */
.qalaqah {
  color: var(--tajweed-qalqalah);
}

/* Madd Normal — 2 counts elongation */
.madda_normal {
  color: var(--tajweed-madd);
}

/* Madd Permissible — 4-5 counts */
.madda_permissible {
  color: var(--tajweed-madd);
}

/* Madd Obligatory (Muttasil) — 4-5 counts */
.madda_obligatory {
  color: var(--tajweed-madd-lazim);
}

/* Madd Necessary (Lazim) — 6 counts */
.madda_necessary {
  color: var(--tajweed-madd-lazim);
}

/* Hide decorative Alef variants that render as circles in some fonts */
.madda_normal,
.madda_permissible,
.madda_obligatory,
.madda_necessary {
  font-size: inherit;
}

/* Verse end marker is styled in mushaf.css */

/* Removed tajweed rules — render as normal text */
.ham_wasl,
.laam_shamsiyah,
.slnt,
.madda_normal,
.madda_permissible {
  color: inherit !important;
  opacity: 1 !important;
}
