/* NexDemo Polish: shared fixes for every demo. Loaded after the plugin and the site's Additional CSS. */

/* 1. Demo bar on phones: a slim strip at the top of the page instead of a floating card.
      The floating card sat on top of the sticky Apply / RSVP / Message seller button. */
@media (max-width: 640px) {
  html body { display: flex; flex-direction: column; }
  html body > * { flex: 0 0 auto; min-width: 0; }
  html body .nxdc { order: -1; position: static; transform: none; left: auto; bottom: auto; width: 100%; z-index: auto; font-size: 13px; }
  html body .nxdc__in { gap: 8px; padding: 6px 6px 6px 12px; border-radius: 0; border: 0; box-shadow: none; background: #111118; -webkit-backdrop-filter: none; backdrop-filter: none; }
  html body .nxdc__logo { width: 24px; height: 24px; border-radius: 7px; font-size: 12px; }
  html body .nxdc__txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html body .nxdc__btn { min-height: 32px; padding: 0 12px; border-radius: 8px; font-size: 13px; }
  html body .nxdc__x { width: 28px; height: 28px; }
}

/* 2. Read-only notice ("Posting is off on this demo"): never wider than the screen, and in the site's own type. */
html body .nexdemo-ro { box-sizing: border-box; width: 100%; max-width: 100vw; padding-left: 16px; padding-right: 16px; font-family: var(--nd-font, inherit); }
html body .nexdemo-ro__card { box-sizing: border-box; font-family: var(--nd-font, inherit); }
html body .nexdemo-ro__h { font-family: var(--nd-font-display, var(--nd-font, inherit)); }
html body .nexdemo-ro__p, html body .nexdemo-ro__eyebrow { font-family: var(--nd-font, inherit); }

/* 3. Home search widget: one consistent select style instead of the browser's native control. */
html body .nexdirectory-widget-search-form select {
  -webkit-appearance: none; appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23707684' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 11px auto;
  padding-right: 32px;
}

/* 4. Phone listing pages: the plugin hides the tab bar there but still parks the sticky action bar 64px up,
      so page text showed underneath it once the demo bar moved to the top. Sit it on the bottom edge. */
@media (max-width: 767px) {
  html.ndn-has-tabbar:has(body.nexdirectory-plugin-page .nds) { --nd-bottom-stack: var(--nd-safe-bottom, 0px); }
}

/* 5. Read-only demo: hide "Message" buttons that only lead to the switched-off sign-in page. */
html body.single-nexdirectory_event .nds-host__actions a.nd-btn[href*="/login-signup/"],
html body.single-nexdirectory_event .nds-actions a.nds-iconbtn[href*="/login-signup/"] { display: none; }
/* Same reason: the "Log in to build your own agenda" hint and the calendar's "+ Add event" button are dead ends here. */
html body .nds-agenda__hint { display: none; }
html body .nd-cal2__headactions > a.nd-btn--primary[href$="/submit/"] { display: none; }

/* 6. Archive hero: the parallax script shifts the photo down on load and leaves a dark strip under the header. */
html body .nd-discover__hero-media img { transform: none !important; }