/* JH · Layout fixes (Oct 2026) — overlap & cramped-layout audit */

/* Big serif numbers: use lining figures so digits don't drop into the label below (Refer tiers, age article) */
.rf-c, .answer-n b { font-variant-numeric: lining-nums !important; font-feature-settings: "lnum" 1 !important; }
.rf-f { display: block; margin-top: 2px; }
.answer-n span { display: block; margin-top: 4px; }

/* Library sheet pages: sticky Download bar — drop the cramped title on phones */
@media (max-width: 440px) {
  .jhp-sticky > span { display: none !important; }
  .jhp-sticky { gap: 10px !important; }
  .jhp-sticky > .jhp-btn { flex: 1 1 auto !important; justify-content: center !important; }
}

/* Library sheet previews: never stretch the paper thumbnails */
.jhp-paper img, img.jhp-back1, img.jhp-back2, .jhp-again img { object-fit: cover !important; object-position: top center !important; }

/* Sheet hero: breathing room under the gold frame line */
.jhp-band .jhp-top { margin-top: 14px !important; }

/* Courses page cards: keep "Learn more" and the price on one line each */
@media (max-width: 480px) {
  .go { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 10px 16px !important; }
  .go .btn, .go .tlink, .go .tlink span { white-space: nowrap !important; }
}

/* Kids shelf: hide decorative doodles on phones (they sat on the search box and button) */
@media (max-width: 600px) { svg.deco-kids { display: none !important; } }

/* Weekly Series cards on tablets: keep the FEATURED badge clear of the day name */
@media (min-width: 700px) and (max-width: 1000px) {
  .jlws-f .jlws-day { padding-right: 92px !important; }
  .jlws-foot { flex-wrap: wrap !important; gap: 8px !important; }
}

/* Dashboard stepper: let step names wrap instead of being cut off */
@media (max-width: 440px) { .tshort { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; } }

/* Library home "Read the Qur'an online" card: button below the text on phones */
@media (max-width: 480px) {
  a[href$="/quran/"][style*="grid-template-columns"] { grid-template-columns: auto 1fr !important; }
  a[href$="/quran/"][style*="grid-template-columns"] > :last-child { grid-column: 1 / -1 !important; justify-self: start !important; }
}

/* Sanad page: space before ﷺ */
p.nm .pbuh { margin-left: .25em !important; }

/* Tiny labels: nothing smaller than 11px */
.jlws-badge, .awp-new, .jhp-free, .jhp-glance .g > span { font-size: 11px !important; }
nav.ap-tabs button span { font-size: 11px !important; }

/* Qur'an reader sidebar: let long surah meanings wrap instead of "…" */
.ap-row .tx small { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }

/* Small tap targets on phones */
@media (max-width: 600px) {
  a.sub, a.fmore, .ap-cta a { display: inline-block !important; padding-top: 10px !important; padding-bottom: 10px !important; }
  /* but not the course links inside the phone menu, which must stay full-width rows */
  .mnav-panel a.sub { display: flex !important; padding-top: 0 !important; padding-bottom: 0 !important; }
}

/* Weekly series "Earlier parts" cards: reserve the cover's space before the image loads, so the "Part N" pill never sits on the title (23 Oct 2026) */
.jhws-card-im { aspect-ratio: 210 / 297; }
.jhws-card-im img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* ===== Site-wide audit, 23 Oct 2026 (every page checked at phone and desktop width) ===== */

/* Weekly series strip on sheet pages ("Part 2 of Brothers' Weekly · See all parts"):
   white text on the dark band — a sheet-page link rule was turning it dark-on-dark */
.jh .jhp a.jhws-strip, .jh a.jhws-strip, a.jhws-strip span, a.jhws-strip b, a.jhws-strip em { color: #fff !important; }

/* Bullet points inside sheet descriptions (e.g. Fard / Sunnah in wudu): soft cards, not capsules,
   so wrapped lines never run into the curved ends */
.jh .jhp-body li { border-radius: 14px !important; line-height: 1.6 !important; padding: 12px 16px !important; }

/* "Add Jamia Hafs as a preferred source on Google" box: same — two lines need a card shape */
.jhps a { border-radius: 16px !important; }
.jhps small { line-height: 1.45 !important; }

/* Sheet pages on phones: the sticky Download bar no longer hides the bottom of the footer */
@media (max-width: 820px) { .jh:has(.jhp-sticky) .ftr { padding-bottom: 100px !important; } }

/* Page titles: a little more space between lines so letters on one line never touch the next */
.jh .h1, .jh h1.h1 { line-height: 1.1 !important; }
.hero-title { line-height: 1.07 !important; }
.hero-title .ln { padding-bottom: .1em !important; }

/* Buttons whose label wraps to two lines on phones */
.jhp-btn2 { line-height: 1.25 !important; padding-top: 10px !important; padding-bottom: 10px !important; }

/* Islamic date today: the "where" label can wrap — card corners, not a capsule */
.jh .dt-where { border-radius: 14px !important; line-height: 1.4 !important; }

/* Big faint Arabic word behind page titles (desktop): fainter, so it never competes with the text */
.watermark { opacity: .035 !important; }

/* Children's sheet pages: "Learn with a teacher" was yellow on a yellow card */
.jh .a-kids .jhp-cta .jhp-tag { color: #6B4E00 !important; }

/* Readability of small labels */
.jhsh-wa, .jhp-sticky a.jhsh-swa { background: #15803D !important; }            /* WhatsApp buttons: white text readable */
.jhcat-c, .jhwl-cat-c { filter: brightness(.72) saturate(1.1); }                  /* "5 sheets", "12 wallpapers" counts */
.st.k { background: #2B7FC0 !important; }                                          /* kids sticker: Storybook, Wall chart… */
.st.n, .jhp-free { background: #DE4A30 !important; }                               /* "New", "Free" stickers */

/* Sisters' Weekly sheets: the series band is light pink there, so its text stays dark */
.jh .a-sisters a.jhws-strip, .jh .a-sisters a.jhws-strip span, .jh .a-sisters a.jhws-strip b, .jh .a-sisters a.jhws-strip em { color: #4A1F2E !important; }
.jh .a-sisters a.jhws-strip em { background: rgba(74, 31, 46, .07) !important; border-color: rgba(74, 31, 46, .2) !important; }

/* Second buttons that wrap to two lines on phones: rounded card corners instead of a capsule */
@media (max-width: 600px) { .jhp-btn2 { border-radius: 16px !important; text-align: left; } }

/* Stat numbers that wrap (e.g. "90 – 180 AH" on Who was Imam Hafs) */
.sstat b { line-height: 1.12 !important; }