@import url('/content/blocks/prayer-times/block.css');
@import url('/content/blocks/prayer-times/themes.css');

/* Keep the page cover authoritative over the shared content-panel skin. */
.hp-prayer-page.hp-prayer-times--content-panel .hp-prayer-hero{
 background-image:var(--hp-prayer-cover-image,url('/content/themes/ultimate-modern/assets/backgrounds/islamic/islamic-dawn-mosque.webp'));
 background-position:center;
 background-size:cover;
 padding:0 clamp(.7rem,3cqi,2rem) clamp(.65rem,3cqi,2rem);
}
.hp-prayer-page.hp-prayer-times--content-panel .hp-prayer-moon{
 width:clamp(112px,15cqi,150px);
 height:clamp(112px,15cqi,150px);
}
.hp-prayer-page.hp-prayer-times--content-panel .hp-prayer-page-description{
 max-width:min(62ch,72%);
 margin:.22rem 0 0;
 color:rgba(255,255,255,.62);
 font-size:clamp(.62rem,1.15cqi,.72rem);
 font-weight:400;
 line-height:1.4;
 text-wrap:pretty;
}
@container(max-width:620px){
 .hp-prayer-page.hp-prayer-times--content-panel .hp-prayer-moon{width:92px;height:92px}
 .hp-prayer-page.hp-prayer-times--content-panel .hp-prayer-page-description{max-width:78%;font-size:.6rem;line-height:1.35}
}