/* RIC Unified Public Layout v20260822.13
   Applies only to GENERAL PUBLIC detail pages.
   Excludes homepage, /member/, /admin/, /api/, /deployment/, /status/, /masjid-tv.php.
*/
:root{
  --ric-u-green:#123f32;
  --ric-u-green-2:#1d5945;
  --ric-u-gold:#d6b44d;
  --ric-u-ivory:#fbfaf5;
  --ric-u-text:#213a32;
  --ric-u-muted:#6f7f78;
  --ric-u-line:#dfe6e1;
  --ric-u-max:1220px;
  --ric-u-radius:18px;
  --ric-u-shadow:0 10px 30px rgba(20,59,47,.07);
}

/* Route classes are added by ric-unified-layout.js. */
body.ric-layout-public:not(.ric-home){
  background:
    linear-gradient(rgba(251,250,245,.94),rgba(251,250,245,.94)),
    repeating-linear-gradient(135deg,rgba(18,63,50,.035) 0 2px,transparent 2px 38px)!important;
  color:var(--ric-u-text)!important;
  overflow-x:hidden!important;
}

/* One calm header shell. */
body.ric-layout-public:not(.ric-home) header,
body.ric-layout-public:not(.ric-home) .site-header,
body.ric-layout-public:not(.ric-home) .ric-global-header{
  background:#fff!important;
  color:var(--ric-u-green)!important;
  border-bottom:1px solid var(--ric-u-line)!important;
  box-shadow:0 3px 14px rgba(16,58,45,.05)!important;
}

/* Hide large/duplicated prayer hero strips on detail pages.
   Prayer functionality stays alive via the small speaker control. */
body.ric-layout-public:not(.ric-home) #ricSalahBanner,
body.ric-layout-public:not(.ric-home) .ric-salah-banner,
body.ric-layout-public:not(.ric-home) .salah-banner,
body.ric-layout-public:not(.ric-home) [data-ric-salah-banner],
body.ric-layout-public:not(.ric-home) .ric-prayer-cycle-banner{
  display:none!important;
}

/* Page body: centered, readable, not edge-to-edge. */
body.ric-layout-public:not(.ric-home) main{
  width:min(var(--ric-u-max),calc(100% - 36px))!important;
  max-width:var(--ric-u-max)!important;
  margin-inline:auto!important;
  padding:30px 0 64px!important;
  box-sizing:border-box!important;
}

/* Avoid accidental nested 100vw/full-bleed sections on detail pages. */
body.ric-layout-public:not(.ric-home) main > section,
body.ric-layout-public:not(.ric-home) main > article,
body.ric-layout-public:not(.ric-home) main > div{
  max-width:100%!important;
  box-sizing:border-box!important;
}
body.ric-layout-public:not(.ric-home) main [style*="100vw"],
body.ric-layout-public:not(.ric-home) main .full-bleed,
body.ric-layout-public:not(.ric-home) main .edge-to-edge{
  width:100%!important;
  max-width:100%!important;
  margin-inline:0!important;
}

/* Unified typography + contrast. */
body.ric-layout-public:not(.ric-home) h1,
body.ric-layout-public:not(.ric-home) h2,
body.ric-layout-public:not(.ric-home) h3,
body.ric-layout-public:not(.ric-home) h4{
  color:var(--ric-u-green)!important;
}
body.ric-layout-public:not(.ric-home) p,
body.ric-layout-public:not(.ric-home) li,
body.ric-layout-public:not(.ric-home) label,
body.ric-layout-public:not(.ric-home) small{
  color:inherit;
}
body.ric-layout-public:not(.ric-home) a{
  text-underline-offset:3px;
}

/* Normalize cards/panels that became translucent/washed or stacked over images. */
body.ric-layout-public:not(.ric-home) .card,
body.ric-layout-public:not(.ric-home) .panel,
body.ric-layout-public:not(.ric-home) .ric-card,
body.ric-layout-public:not(.ric-home) .ric-panel,
body.ric-layout-public:not(.ric-home) .content-card,
body.ric-layout-public:not(.ric-home) .section-card{
  background:#fff!important;
  border:1px solid var(--ric-u-line)!important;
  border-radius:var(--ric-u-radius)!important;
  box-shadow:var(--ric-u-shadow)!important;
  color:var(--ric-u-text)!important;
}

/* Prevent decorative imagery from covering text. */
body.ric-layout-public:not(.ric-home) .hero img,
body.ric-layout-public:not(.ric-home) .page-hero img,
body.ric-layout-public:not(.ric-home) .content-hero img{
  max-width:100%!important;
  height:auto!important;
}
body.ric-layout-public:not(.ric-home) [aria-hidden="true"].background,
body.ric-layout-public:not(.ric-home) .background-art,
body.ric-layout-public:not(.ric-home) .decorative-background{
  pointer-events:none!important;
}

/* Forms follow same visual language. */
body.ric-layout-public:not(.ric-home) input,
body.ric-layout-public:not(.ric-home) select,
body.ric-layout-public:not(.ric-home) textarea{
  max-width:100%!important;
  border:1px solid #cfd9d3!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#183c31!important;
}
body.ric-layout-public:not(.ric-home) button,
body.ric-layout-public:not(.ric-home) .button{
  border-radius:999px;
}

/* ===== Header audio control ===== */
.ric-header-audio-toggle{
  --speaker-bg:#eef4f0;
  position:relative;
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:inline-grid;
  place-items:center;
  border:1px solid #d5dfda;
  border-radius:50%;
  background:var(--speaker-bg);
  color:var(--ric-u-green);
  cursor:pointer;
  padding:0;
  margin-inline-start:7px;
  vertical-align:middle;
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}
.ric-header-audio-toggle:hover{
  transform:translateY(-1px);
  background:#e5efe9;
  border-color:#bdcec5;
}
.ric-header-audio-toggle .ric-speaker-glyph{
  font-size:17px;
  line-height:1;
}
.ric-header-audio-toggle .ric-mute-line{
  position:absolute;
  width:26px;
  height:2px;
  border-radius:2px;
  background:#c73e3e;
  transform:rotate(-42deg);
  opacity:0;
  box-shadow:0 0 0 1px rgba(255,255,255,.65);
}
.ric-header-audio-toggle[aria-pressed="true"]{
  --speaker-bg:#fff1ef;
  border-color:#efc3be;
}
.ric-header-audio-toggle[aria-pressed="true"] .ric-mute-line{
  opacity:1;
}
.ric-header-audio-toggle.is-not-ready::after{
  content:"";
  position:absolute;
  right:-2px;
  top:-2px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#d6b44d;
  border:2px solid #fff;
}

/* Small tooltip, rather than a giant "Adhan disabled" banner. */
.ric-header-audio-tooltip{
  position:fixed;
  z-index:99999;
  max-width:280px;
  padding:8px 11px;
  border-radius:9px;
  background:#10392d;
  color:#fff;
  font-size:12px;
  line-height:1.3;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  pointer-events:none;
  opacity:0;
  transform:translateY(-4px);
  transition:opacity .16s ease,transform .16s ease;
}
.ric-header-audio-tooltip.is-visible{
  opacity:1;
  transform:translateY(0);
}

/* If the old huge muted/disabled pill is present, collapse it on detail pages. */
body.ric-layout-public:not(.ric-home) .ric-adhan-disabled,
body.ric-layout-public:not(.ric-home) .adhan-disabled-banner,
body.ric-layout-public:not(.ric-home) [data-adhan-disabled-banner]{
  display:none!important;
}

/* Footer alignment */
body.ric-layout-public:not(.ric-home) footer,
body.ric-layout-public:not(.ric-home) .ric-footer,
body.ric-layout-public:not(.ric-home) .ric-global-footer{
  background:var(--ric-u-green)!important;
  color:#fff!important;
}
body.ric-layout-public:not(.ric-home) footer a,
body.ric-layout-public:not(.ric-home) footer p,
body.ric-layout-public:not(.ric-home) footer span,
body.ric-layout-public:not(.ric-home) footer small{
  color:rgba(255,255,255,.86)!important;
}

/* Do not alter member/admin shells. */
body.ric-layout-member main,
body.ric-layout-admin main{
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}

/* Mobile */
@media(max-width:720px){
  body.ric-layout-public:not(.ric-home) main{
    width:min(100% - 20px,var(--ric-u-max))!important;
    padding-top:20px!important;
  }
  .ric-header-audio-toggle{
    width:36px;
    height:36px;
    flex-basis:36px;
  }
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  .ric-header-audio-toggle,
  .ric-header-audio-tooltip{
    transition:none!important;
  }
}