/* ==========================================================================
   DUS AUTHOR BIOGRAPHY — shared stylesheet for all dus_blog author posts
   Namespace: .dus-bio
   Reuses Dus26 :root variables with hard fallbacks so the file also renders
   correctly in email previews, CMS editors and admin WYSIWYG panes.
   ========================================================================== */
/* --- Local tokens: bio-specific values layered on the Dus26 theme vars --- */
.dus-bio {
  --bio-fg:          var(--secondary-color, #111111);
  --bio-accent:      var(--primary-color, #fad505);
  --bio-link:        var(--link-hover-color, #0961b3);
  --bio-panel:       var(--box-bodybkg-color, #F0F0F0);
  --bio-radius:      var(--border-radius, 5px);
  --bio-hairline:    #dddddd;
  --bio-gap:         34px;
}
/* --- Wrapper: base typography for the whole biography body --- */
.dus-bio {
  font-family: var(--body-font-family, Heebo), Arial, Helvetica, sans-serif;
  font-size: var(--body-font-size, 15px);
  line-height: 1.8;
  color: var(--bio-fg);
}
.dus-bio p {
  margin: 0 0 16px 0;
}
/* --- Lead paragraph: oversized opening summary above the first heading --- */
.dus-bio__lead {
  font-size: 17px;
  line-height: 1.9;
  margin-bottom: 22px;
}
/* --- Section heading: h2 with the brand-yellow underline rule --- */
.dus-bio__h2 {
  font-family: var(--title-font-family, Heebo), Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: var(--bio-fg);
  margin: var(--bio-gap) 0 12px 0;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--bio-accent);
}
/* --- Inline links inside biography prose --- */
.dus-bio a {
  color: var(--bio-link);
  text-decoration: none;
  font-weight: 600;
}
.dus-bio a:hover,
.dus-bio a:focus {
  text-decoration: underline;
}
/* --- Sources panel: classical references cited for the biography --- */
.dus-bio__sources {
  background-color: var(--bio-panel);
  border-left: 4px solid var(--bio-accent);
  border-radius: var(--bio-radius);
  padding: 16px 20px;
  margin: 0 0 30px 0;
  font-size: 14px;
  line-height: 1.7;
}
.dus-bio__sources-title {
  display: block;
  font-weight: 700;
  margin-bottom: 6px;
}
/* --- Quote block: ayah or hadith pulled out of the running text --- */
.dus-bio__quote {
  background-color: var(--bio-panel);
  border-left: 4px solid var(--bio-accent);
  border-radius: var(--bio-radius);
  padding: 16px 20px;
  margin: 0 0 24px 0;
}
.dus-bio__quote-text {
  font-size: 16px;
  line-height: 1.9;
  font-style: italic;
  margin: 0 0 8px 0;
}
.dus-bio__quote-ref {
  font-size: 13px;
  margin: 0;
}
/* Variant with no left border — used for the intro-plus-quote combination */
.dus-bio__quote--flat {
  border-left: 0;
  padding: 18px 22px;
}
/* --- Note box: corrections and caveats set apart from the main argument --- */
.dus-bio__note {
  background-color: var(--bio-panel);
  border-radius: var(--bio-radius);
  padding: 12px 16px;
  margin: 0 0 16px 0;
  font-size: 14px;
}
/* --- Bulleted lists: teachers, students, works --- */
.dus-bio__list {
  margin: 0 0 20px 0;
  padding-left: 22px;
}
.dus-bio__list > li {
  margin-bottom: 6px;
}
/* --- Works table: two-column table of the author's books --- */
.dus-bio__table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 24px 0;
  font-size: 14px;
  line-height: 1.7;
}
.dus-bio__table th {
  text-align: left;
  padding: 10px 12px;
  background-color: var(--bio-fg);
  color: var(--bio-accent);
  font-weight: 700;
  border: 1px solid var(--bio-fg);
}
.dus-bio__table td {
  padding: 10px 12px;
  border: 1px solid var(--bio-hairline);
  vertical-align: top;
}
/* Zebra striping without needing a class on every other row */
.dus-bio__table tbody tr:nth-child(even) td {
  background-color: var(--bio-panel);
}
/* --- Product list: linked catalogue titles with a one-line description --- */
.dus-bio__books {
  margin: 0 0 20px 0;
  padding-left: 22px;
}
.dus-bio__books > li {
  margin-bottom: 14px;
}
.dus-bio__book-title {
  font-size: 16px;
  font-weight: 700;
}
/* --- Footer line: category and author-index links closing the post --- */
.dus-bio__footer-links {
  font-size: 14px;
  margin: 0 0 10px 0;
}
/* --- Salawat glyph: keeps the salawat mark from inflating line-height --- */
.dus-bio__salawat {
  font-size: 0.85em;
  line-height: 1;
}
/* --- Mobile: stack the works table into labelled rows below 576px --- */
@media (max-width: 575px) {
  .dus-bio__lead {
    font-size: 16px;
  }
  .dus-bio__h2 {
    font-size: 20px;
    margin-top: 26px;
  }
  .dus-bio__table,
  .dus-bio__table tbody,
  .dus-bio__table tr,
  .dus-bio__table td {
    display: block;
    width: 100%;
  }
  .dus-bio__table thead {
    display: none;
  }
  .dus-bio__table tr {
    margin-bottom: 14px;
    border: 1px solid var(--bio-hairline);
    border-radius: var(--bio-radius);
    overflow: hidden;
  }
  .dus-bio__table td {
    border: 0;
    border-bottom: 1px solid var(--bio-hairline);
  }
  .dus-bio__table tr td:last-child {
    border-bottom: 0;
  }
}
/* --- Print: drop panel fills and expand link targets --- */
@media print {
  .dus-bio__sources,
  .dus-bio__quote,
  .dus-bio__note,
  .dus-bio__table tbody tr:nth-child(even) td {
    background-color: transparent;
  }
  .dus-bio a {
    color: var(--bio-fg);
  }
  .dus-bio a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 11px;
    font-weight: 400;
  }
}
