/* Schema patch 39.11 in the Sangat portal: the 🏛️ Main Sanctuary menu (<djjs-sanctuary-menu>, assets/js/sanctuary-menu.js)
   and the Broadcast Ping WhatsApp check-in (.djjs-wa-ping: the practice column, assets/js/portal-command.js, and the dial
   drawer, tools/patch-spa.py). The app's own tokens (--c-surface, --c-ink, --c-muted, --champagne, --djjs-lux) carry
   Temple Dark and Temple Dawn. */

/* ---- the header menu (from 40rem; phones use the More sheet rows below) ---- */
djjs-sanctuary-menu:not([variant]) { display: none; }
@media (min-width: 40rem) { djjs-sanctuary-menu:not([variant]) { display: inline-flex; position: relative; flex: none; } }
.djjs-sm__btn { position: relative; font: inherit; color: var(--c-ink); cursor: pointer; }
.djjs-sm__caret { display: inline-block; width: .45rem; height: .45rem; margin: -.2rem .1rem 0 -.1rem; border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor; transform: rotate(45deg); opacity: .7; }
@media (max-width: 63.99rem) { .djjs-sm__caret { display: none; } }
djjs-sanctuary-menu[data-open] .djjs-sm__btn { border-color: rgba(217, 119, 6, .6); box-shadow: 0 0 0 3px rgba(245, 158, 11, .16); }
djjs-sanctuary-menu[data-open] .djjs-sm__caret { margin-top: .25rem; transform: rotate(-135deg); }
.djjs-sm__btn:focus-visible { outline: 3px solid var(--focus, #FCD34D); outline-offset: 2px; }

.djjs-sm__panel {
  position: absolute; top: calc(100% + .5rem); right: 0; z-index: 70; width: min(20rem, calc(100vw - 2rem));
  padding: .5rem; border: 1px solid var(--champagne); border-radius: 1.25rem; background: var(--c-surface);
  box-shadow: var(--djjs-lux); color: var(--c-ink); text-align: left;
}
.djjs-sm__panel[hidden] { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .djjs-sm__panel:not([hidden]) { animation: djjs-sm-in .18s ease-out; }
}
@keyframes djjs-sm-in { from { opacity: 0; transform: translateY(-4px); } }
.djjs-sm__k { margin: .25rem .75rem .375rem; font-size: .68rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
.djjs-sm__ul, .djjs-sm-list { display: grid; gap: .125rem; margin: 0; padding: 0; list-style: none; }

.djjs-sm__a, .djjs-sm-list__a {
  display: flex; align-items: center; gap: .75rem; min-height: 2.75rem; padding: .45rem .75rem; border-radius: .875rem;
  color: var(--c-ink); text-decoration: none;
}
.djjs-sm__a:hover, .djjs-sm-list__a:hover { background: rgba(217, 119, 6, .1); }
.djjs-sm__a:focus-visible, .djjs-sm-list__a:focus-visible { outline: 3px solid var(--focus, #FCD34D); outline-offset: -3px; }
.djjs-sm__a[aria-current="page"], .djjs-sm-list__a[aria-current="page"] { box-shadow: inset 3px 0 0 #D97706; }
.djjs-sm__a-icon, .djjs-sm-list__a-icon { flex: none; width: 1.5rem; font-size: 1.2rem; line-height: 1; text-align: center; }
.djjs-sm__a-text, .djjs-sm-list__a-text { display: grid; min-width: 0; line-height: 1.2; }
.djjs-sm__a-label, .djjs-sm-list__a-label { font-family: var(--font-display); font-size: 1.08rem; font-weight: 600; }
.djjs-sm__a-sub, .djjs-sm-list__a-sub { font-size: .78rem; color: var(--c-muted); }

/* ---- the phone More sheet: the other wings under the gold Main Sanctuary row ---- */
djjs-sanctuary-menu[variant="list"] { display: block; margin: 0 0 .5rem; padding: 0 0 .5rem .5rem; border-bottom: 1px solid var(--champagne); }
.djjs-sm-list__a { padding-block: .35rem; }
.djjs-sm-list__a-label { font-size: 1rem; }

/* ---- Broadcast Ping: "🙏 JMJK 🧘 Sitting for Sadhna now" to a WhatsApp group (/s/ping, includes/sadhna-ping.php) ---- */
.djjs-wa-ping {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 2.75rem;
  padding: 0 1rem; border: 1px solid rgba(15, 122, 108, .45); border-radius: 999px; background: rgba(15, 122, 108, .08);
  color: var(--c-ink); font-size: .85rem; font-weight: 600; line-height: 1.2; text-decoration: none; transition: background .2s, border-color .2s;
}
.djjs-wa-ping:hover { background: rgba(15, 122, 108, .16); border-color: #0F7A6C; }
.djjs-wa-ping:focus-visible { outline: 3px solid var(--focus, #FCD34D); outline-offset: 2px; }
.djjs-wa-ping__icon { width: 1.15rem; height: 1.15rem; flex: none; color: #25D366; }
:root:not(.dark) .djjs-wa-ping__icon { color: #0F7A6C; }
.djjs-pc-sit .djjs-wa-ping { display: flex; width: 100%; margin-top: .5rem; }

/* ---- schema patch 39.12: the More sheet's two section headings ---- */
.djjs-more-h { margin: .5rem .75rem .375rem; font-size: .68rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
li:first-child > .djjs-more-h { margin-top: 0; }

/* ---- schema patch 39.13: Darshan in the header (<djjs-darshan-medallion>, assets/js/darshan-medallion.js) ---- */
djjs-darshan-medallion { display: inline-flex; flex: none; }
djjs-darshan-medallion[hidden] { display: none; }
.portal-darshan-medallion {
  position: relative; display: grid; place-items: center; width: 2.75rem; min-height: 2.75rem; padding: 0; border: 0;
  background: transparent; cursor: pointer; flex: none;
}
.portal-darshan-medallion::before {   /* the subtle aura behind the arch */
  content: ""; position: absolute; left: 50%; top: 50%; width: 46px; height: 54px; transform: translate(-50%, -50%);
  border-radius: 50%; pointer-events: none; background: radial-gradient(closest-side, rgba(253, 230, 138, .45), rgba(245, 158, 11, .16) 62%, transparent);
}
.darshan-mini-swaroop {
  position: relative; display: block; width: 34px; height: 42px; object-fit: cover; object-position: 50% 18%;
  border: 1.5px solid #D97706; border-radius: 17px 17px 4px 4px; background: #1D1510;
  box-shadow: 0 0 8px rgba(217, 119, 6, .35);
}
@media (prefers-reduced-motion: no-preference) {
  .darshan-mini-swaroop { transition: transform .2s ease, box-shadow .2s ease; }
  .portal-darshan-medallion:hover .darshan-mini-swaroop, djjs-darshan-medallion[data-open] .darshan-mini-swaroop { transform: scale(1.05); box-shadow: 0 0 12px rgba(245, 158, 11, .55); }
}
.portal-darshan-medallion:focus-visible { outline: 3px solid var(--focus, #FCD34D); outline-offset: 2px; border-radius: 12px; }
/* a narrow phone keeps the header on one row: the arch narrows a little, its touch target stays 44 px tall */
@media (max-width: 359.98px) { .portal-darshan-medallion { width: 2.25rem; } .darshan-mini-swaroop { width: 28px; height: 35px; border-radius: 14px 14px 4px 4px; } }

.portal-darshan-popover {
  position: fixed; z-index: 80; box-sizing: border-box; display: grid; justify-items: center; gap: .35rem; padding: 1.25rem 1.25rem 1rem;
  border: 1px solid var(--champagne, rgba(245, 158, 11, .2)); border-radius: 1.5rem; background: var(--c-surface); color: var(--c-ink);
  box-shadow: var(--djjs-lux), 0 0 60px -20px rgba(245, 158, 11, .45); text-align: center;
}
.portal-darshan-popover[hidden] { display: none; }
@media (prefers-reduced-motion: no-preference) { .portal-darshan-popover:not([hidden]) { animation: djjs-darshan-in .22s ease-out; } }
@keyframes djjs-darshan-in { from { opacity: 0; transform: translateY(-4px); } }
.portal-darshan-popover__arch {
  position: relative; display: block; width: 132px; height: 164px; margin-bottom: .35rem; overflow: hidden;
  border: 2px solid #D97706; border-radius: 66px 66px 10px 10px; background: #1D1510;
  box-shadow: 0 0 0 5px rgba(245, 158, 11, .1), 0 0 36px rgba(245, 158, 11, .35);
}
.portal-darshan-popover__arch img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.portal-darshan-popover__t { margin: 0; font: 600 1.15rem/1.2 var(--font-display, "Cormorant Garamond", Georgia, serif); }
.portal-darshan-popover__org { margin: 0; font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); }
.portal-darshan-popover__k { margin: .6rem 0 0; font-size: .66rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--c-accent-ink, #B45309); }
:root.dark .portal-darshan-popover__k { color: #F59E0B; }
.portal-darshan-popover__q { margin: 0; font: 500 1.02rem/1.4 var(--font-display, "Cormorant Garamond", Georgia, serif); }
.portal-darshan-popover__by { margin: 0; font-size: .72rem; color: var(--c-muted); }
/* 39.14: Share on WhatsApp (replaced Dhyan Pranam): white on emerald, edged in gold, readable on Temple Dark and Temple Dawn */
.btn-darshan-share-wa {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 2.75rem;
  margin-top: .7rem; padding: 0 1.25rem; border: 1px solid rgba(245, 158, 11, .65); border-radius: 999px; cursor: pointer;
  background: linear-gradient(135deg, #0F7A6C 0%, #0B5E53 70%, #7A5A12 140%); color: #FFFFFF; font: inherit; font-weight: 600;
  box-shadow: 0 8px 22px -12px rgba(15, 122, 108, .9), inset 0 1px 0 rgba(255, 255, 255, .12);
}
.btn-darshan-share-wa[hidden] { display: none; }
.btn-darshan-share-wa .icon { font-size: 1.05rem; line-height: 1; }
.btn-darshan-share-wa:hover { box-shadow: 0 0 0 3px rgba(245, 158, 11, .22), 0 10px 26px -12px rgba(15, 122, 108, 1); }
.btn-darshan-share-wa:focus-visible { outline: 3px solid var(--focus, #FCD34D); outline-offset: 2px; }
@media (prefers-reduced-motion: no-preference) {
  .btn-darshan-share-wa { transition: transform .15s ease, box-shadow .2s ease; }
  .btn-darshan-share-wa:hover { transform: translateY(-1px); }
  .btn-darshan-share-wa:active { transform: translateY(0) scale(.98); }
}

/* ---- schema patch 39.13: the hour bar's Broadcast Ping, beside Start / Join (no scrolling to reach it) ---- */
.djjs-hourbar__cta { flex-wrap: wrap; align-items: center; gap: .5rem; }
/* the hour bar is dark wine in both themes, so the button carries its own colours: ivory on emerald (5.3:1) */
.btn-sadhna-broadcast { cursor: pointer; font-family: inherit; white-space: nowrap; color: #FFFFFF; border-color: rgba(110, 231, 183, .55);
  background: linear-gradient(135deg, #0F7A6C, #0B5E53); box-shadow: 0 8px 20px -12px rgba(15, 122, 108, .9); }
.btn-sadhna-broadcast:hover { color: #FFFFFF; background: linear-gradient(135deg, #12907F, #0F7A6C); border-color: #6EE7B7; }
.btn-sadhna-broadcast .icon { font-size: 1rem; line-height: 1; }

/* ---- schema patch 39.35: the devotee ribbon's Rudri Path, Aarti and Studio; the studio in the JMJK profile menu ----
   (tools/patch-spa.py P3935_A_PATCHES). Eleven entries share the row from 1024 px: a touch less padding, and the new entries'
   emoji stay visible where the row hides the line icons (below 1280 px). The studio entry is gold (Temple Dark #F59E0B,
   Temple Dawn #92400E, AA on parchment); it exists only for members the shell marked <html data-djjs-studio>. */
.djjs-rib { gap: 0; }
.djjs-rib .djjs-rib__a { padding-inline: .45rem; }
@media (min-width: 1280px) { .djjs-rib .djjs-rib__a { padding-inline: .5rem; gap: .4rem; } }
.djjs-rib .djjs-rib__emo { display: inline-grid !important; place-items: center; width: auto; height: auto; font-size: .95rem; line-height: 1; transform: none; }
.djjs-rib .djjs-rib--studio { color: #92400E; font-weight: 600; }
.djjs-rib .djjs-rib--studio:hover { color: #78350F; }
:root.dark .djjs-rib .djjs-rib--studio { color: #F59E0B; }
:root.dark .djjs-rib .djjs-rib--studio:hover { color: #FCD34D; }
.djjs-rib .djjs-rib--studio::before { content: ""; position: absolute; inset: .55rem 0; border: 1px solid rgba(217, 119, 6, .35);
  border-radius: 999px; pointer-events: none; }
:root.dark .djjs-rib .djjs-rib--studio::before { border-color: rgba(245, 158, 11, .35); }
.djjs-menu-studio { position: relative; color: #92400E; font-weight: 600; }
:root.dark .djjs-menu-studio { color: #F59E0B; }
.djjs-menu-studio__i { display: inline-grid; place-items: center; width: 1rem; height: 1rem; font-size: .95rem; line-height: 1; }