/* NexDemo Polish: wellness (Morning Ritual, Sydney wellness directory).
   Loaded last: after the plugin CSS, the site's Additional CSS (re-issued in @layer nexdemo) and common.css.
   Identity kept: sage #5E7356, teal #2E5E6E, Manrope, cream canvas, glass cards.

   Fixes, one line each:
   1a   Place page, desktop: one 680px column becomes two columns; opening hours is a sticky glass card on the right.
   1a-2 Place page, desktop: cover 76vh -> 60vh so the title panel's "Book a class" button clears the demo bar.
   1b   Place page: calmer section headings, more readable intro text.
   1c   Place page: a gallery of two or three photos fills its row.
   1d   Place page: location map warmed to the cream palette (blend on the map box; pin colour kept).
   1e   Place page: "Good to know" as labelled tiles.
   1f   Place page: hides the one-name "Contact" stub, "Listed by <name>" and the Message icon (dead end).
   1g   Place page: Save / Share shown as labelled pills under a rule.
   2a   Maps: basemap tiles tinted sand and pale teal (tile layer only).
   2b   Maps: single pins use the same sage fill as clusters.
   2c   Map page, phone: category chips are one swipeable row so the first result is visible.
   3a   Archive: chip row no longer clipped at the left edge.
   3b   Archive, phone: search card and intro get the 16px page gutter.
   3c   Archive: pagination as separate sage pills (was navy, merged into one box).
   4a   Header, desktop: navigation moves to the right of the bar; dropdowns open from the right.
   4b   Footer: sand band, links as a two-column block at the right, eyebrow-style heading.
   5a   Home: hero subtitle and kicker readable over the surf photo.
   6a   About / 404 (theme pages): header and footer lined up with the plugin chrome; three-line menu mark.
   6b   About: one aligned column on the archive's dawn wash, feature list as ticked rows, brand buttons.
   7a   "Just added": readable subtitle.
   7b   "Just added": duplicate pagination hidden (its links leave the feed); "View all places" stays.

   Notes for whoever merges this:
   - Three blocks are written inside "@layer nexdemo { }" (1a-2, 6a, 6b). They override declarations that the
     Additional CSS marks !important, and only work while the helper plugin keeps that layer name.
   - content: is used only for decorative marks (ticks, menu lines) and, in 1g, to show a button's own
     aria-label / tooltip text next to its icon.
*/

/* ==========================================================================
   1. Place page (Minimal template)
   ========================================================================== */

/* 1a. Desktop: the body was one 680px column in a 1440 page, eight same-weight blocks deep, wide empty margins.
       Two columns: story, services, gallery, map and facts on the left; opening hours as a glass card on the
       right that stays in view while the page scrolls (one item only, so no row can be stretched by it). */
@media (min-width: 1024px) {
  html body.single-nexdirectory_event .nds--minimal .nds-min { max-width: calc(1240px + var(--nds-gutter, 24px) * 2); }
  html body.single-nexdirectory_event .nds--minimal .nds-about .nds-prose { max-width: 68ch; }
  html body.single-nexdirectory_event .nds--minimal .nds-min__body {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 392px); column-gap: clamp(40px, 5vw, 72px); align-items: start;
  }
  html body.single-nexdirectory_event .nds--minimal .nds-min__body > * { grid-column: 1; min-width: 0; }
  html body.single-nexdirectory_event .nds--minimal .nds-min__body > .nds-section { margin-top: 52px; }
  html body.single-nexdirectory_event .nds--minimal .nds-min__body > .nds-about:first-child { margin-top: 8px; }
  html body.single-nexdirectory_event .nds--minimal .nds-min__body > #nds-hours {
    grid-column: 2; grid-row: 1 / span 12; position: sticky; top: 96px; margin-top: 8px;
    padding: 26px 26px 24px; border-radius: 24px;
    background: rgba(255, 253, 249, .8); border: 1px solid var(--nd-line, #E8DFD2);
    box-shadow: 0 30px 60px -44px rgba(35, 39, 31, .45);
  }
  html body.single-nexdirectory_event .nds--minimal .nds-min__body > #nds-hours .nds-sectionhead { gap: 10px; }
}

/* 1a-2. Desktop first screen: the cover was 76vh tall, which put the title panel's only button ("Book a
       class") exactly under the floating demo bar at 1440x900. A 60vh cover keeps the photo generous and
       lifts the panel and its button into view. (In the nexdemo layer: the height is !important there.) */
@layer nexdemo {
  @media (min-width: 782px) { html body.single-nexdirectory_event .nds--minimal .nds-min__img--top { height: clamp(380px, 60vh, 620px) !important; } }
}

/* 1b. Section headings and intro text: calmer heading weight, larger and darker body copy. */
html body.single-nexdirectory_event .nds--minimal .nds-min__body .nds-h2 { font-weight: 600; letter-spacing: -.015em; color: var(--mr-ink, #23271F); }
html body.single-nexdirectory_event .nds--minimal .nds-about .nds-prose { font-size: 1.0625rem; line-height: 1.7; color: #363B31; }

/* 1c. Gallery of two or three: thumbnails sat left with most of the row empty. Let them share the row. */
html body.single-nexdirectory_event .nds--minimal .nds-gallery--rail .nds-gallery__grid:has(> :nth-child(2):last-child),
html body.single-nexdirectory_event .nds--minimal .nds-gallery--rail .nds-gallery__grid:has(> :nth-child(3):last-child) { grid-auto-columns: minmax(0, 1fr); overflow-x: visible; }
html body.single-nexdirectory_event .nds--minimal .nds-gallery__item { border-radius: 18px; }

/* 1d. Location card: the light-grey basemap was cold against the cream palette. The tiles (and the pin) are
       inside an iframe, so blend the frame onto a cream ground instead of recolouring it: land turns sand,
       roads cream, the sage pin keeps its colour. Card rounded like the others. */
html body.single-nexdirectory_event .nds--minimal .nds-venue__card { border-radius: 24px; overflow: hidden; background: rgba(255, 253, 249, .8); }
html body.single-nexdirectory_event .nds--minimal .nds-venue__map { background: #FFF5E4; isolation: isolate; }
html body.single-nexdirectory_event .nds--minimal .nds-venue__map iframe { mix-blend-mode: multiply; }

/* 1e. Good to know: label / value pairs as small glass tiles instead of a ruled field dump. */
html body.single-nexdirectory_event .nds--minimal .nds-facts { gap: 12px; }
html body.single-nexdirectory_event .nds--minimal .nds-fact { border: 1px solid var(--nd-line, #E8DFD2); border-radius: 18px; padding: 16px 18px; background: rgba(255, 253, 249, .8); }
html body.single-nexdirectory_event .nds--minimal .nds-fact dt { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--mr-sage, #5E7356); margin-bottom: 6px; }
html body.single-nexdirectory_event .nds--minimal .nds-fact dd { color: var(--mr-ink, #23271F); line-height: 1.55; }

/* 1f. "Contact" was an initial in a circle and a first name: no phone, site or button (messaging is off on
       this demo, and the block's own meta line and buttons are already hidden). A one-field stub: hide it.
       Same for "Listed by <first name>" under a venue name, and the Message icon that leads to the
       "Accounts are off" dead end. */
html body.single-nexdirectory_event .nds--minimal #nds-host,
html body.single-nexdirectory_event .nds--minimal .nds-min__by,
html body.single-nexdirectory_event .nds--minimal .nds-min__share a.nds-iconbtn[href*="login-signup"] { display: none; }
html body.single-nexdirectory_event .nds--minimal .nds-min__meta .nds-min__by + span::before { content: none; }
/* a title panel with no action button kept an empty 36px action row under the meta line */
html body.single-nexdirectory_event .nds--minimal .nds-min__cta:not(:has(*)) { display: none; }

/* 1g. Save / Share were unlabeled icon circles floating on their own row. Show each control's own label
       (its aria-label / tooltip text) beside the icon, as quiet pills under a hairline. */
html body.single-nexdirectory_event .nds--minimal .nds-min__share { margin-top: 44px; padding-top: 24px; border-top: 1px solid var(--nd-line, #E8DFD2); }
html body.single-nexdirectory_event .nds--minimal .nds-min__share .nds-actions { justify-content: flex-start; flex-wrap: wrap; }
html body.single-nexdirectory_event .nds--minimal .nds-min__share .nds-iconbtn { width: auto; max-width: 100%; height: 44px; padding: 0 18px 0 14px; border-radius: 999px; display: inline-flex; align-items: center; gap: 9px; flex-direction: row; font-size: 14px; font-weight: 600; color: var(--nd-ink-2, #363B31); background: rgba(255, 253, 249, .8); }
html body.single-nexdirectory_event .nds--minimal .nds-min__share .nds-iconbtn::before { order: 2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html body.single-nexdirectory_event .nds--minimal .nds-min__share .nds-save::before { content: attr(aria-label); }
html body.single-nexdirectory_event .nds--minimal .nds-min__share .nd-tip[data-tip]::before { content: attr(data-tip); }
html body.single-nexdirectory_event .nds--minimal .nds-min__share .nd-tip[data-tip]::after { display: none; }

/* ==========================================================================
   2. Maps (home "On the map", the map page)
   ========================================================================== */
/* 2a. The light-grey basemap was cold against the cream palette. Tint the tile layer only (pins untouched):
       sand land, pale teal water, neutral labels. */
html body .nd-mapx .leaflet-tile-pane { filter: saturate(4.26) hue-rotate(-59deg) sepia(.13) contrast(.95) saturate(1.63); }
/* 2b. Two pin languages on one map (filled numbered clusters, outlined white pins). Single pins take the
       same sage fill and white ring as the clusters; the teardrop shape still tells them apart. */
html body .nd-mapx .nd-pin--round .nd-pin__round { background: var(--mr-sage, #5E7356); color: #FFFDF9; box-shadow: 0 6px 14px -6px rgba(35, 39, 31, .55), 0 0 0 2px rgba(255, 253, 249, .92); }
html body .nd-mapx .nd-pin--round:hover .nd-pin__round,
html body .nd-mapx .nd-pin--round.is-active .nd-pin__round { background: var(--mr-ink, #23271F); color: #FFFDF9; }

/* 2c. Phone map page: the category chips wrapped to five rows inside the bottom sheet, so no place was
       visible under the map without dragging. One swipeable chip row; the first result now shows. */
@media (max-width: 767.98px) {
  html body .nd-mapx .nd-mapx__panel .nd-mapx__rail { display: flex; flex-wrap: nowrap; align-items: center; gap: 6px; overflow-x: auto; padding: 10px 16px 12px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  html body .nd-mapx .nd-mapx__panel .nd-mapx__rail::-webkit-scrollbar { display: none; }
  html body .nd-mapx .nd-mapx__panel .nd-mapx__rail > .nd-qchip { flex: 0 0 auto; margin: 0; }
}

/* ==========================================================================
   3. Archive ("Discover places"), empty search, "Just added"
   ========================================================================== */
/* 3a. Chip row: centred with overflow, so the first chips were pushed off the left edge and could not be
       scrolled back to (worst on phones: the row opened on "...rk | Meditation"). Start-aligned; auto margins
       still centre the row when it fits. The plugin's own edge fade then shows that the row scrolls. */
html body .nd-archive.nd-discover .nd-rail__track { justify-content: flex-start; }
html body .nd-archive.nd-discover .nd-rail__track > :first-child { margin-left: auto; }
html body .nd-archive.nd-discover .nd-rail__track > :last-child { margin-right: auto; }

/* 3b. Phone: search card and intro ran flush to both screen edges while everything else has a 16px gutter. */
@media (max-width: 767.98px) {
  html body .nd-archive.nd-discover .nd-discover__hero-inner > .nd-searchbar { width: calc(100% - 32px); }
  html body .nd-archive.nd-discover .nd-discover__hero-inner > .nd-discover__lede,
  html body .nd-archive.nd-discover .nd-discover__hero-inner > .nd-discover__title { padding-inline: 16px; box-sizing: border-box; }
}

/* 3c. Pagination: navy link colour that appears nowhere else, and on phones the three buttons read as one
       merged control (the list itself is styled as a white box because it shares the "page-numbers" class).
       Separate round pills, sage text, current page in ink. */
html body .nd-discover .nexdirectory-pagination ul.page-numbers { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 0; margin: 0; background: none; border: 0; box-shadow: none; height: auto; min-width: 0; }
html body :is(#nexdirectory-app, #nexdirectory-archive-results, .nd-discover) .nexdirectory-pagination :is(a, span).page-numbers { min-width: 46px; height: 46px; padding: 0 16px; border-radius: 999px; color: var(--mr-sage-dark, #4C5F45); background: rgba(255, 253, 249, .8); border: 1px solid var(--nd-line-strong, #DACFBF); font-weight: 600; text-decoration: none; margin: 0; box-shadow: none; }
html body :is(#nexdirectory-app, #nexdirectory-archive-results, .nd-discover) .nexdirectory-pagination a.page-numbers:hover { background: rgba(94, 115, 86, .12); border-color: var(--mr-sage, #5E7356); }
html body :is(#nexdirectory-app, #nexdirectory-archive-results, .nd-discover) .nexdirectory-pagination .page-numbers.current { background: var(--mr-ink, #23271F); border-color: var(--mr-ink, #23271F); color: #FFFDF9; }

/* ==========================================================================
   4. Header and footer (plugin chrome on every directory page)
   ========================================================================== */
/* 4a. Desktop header: logo and two links hard left, right two-thirds empty. Logo left, navigation right. */
@media (min-width: 1024px) {
  html body .ndn .ndn-primary { justify-content: flex-end; }
  html body .ndn .ndn-primary .ndn-menu { margin-left: auto; }
  /* dropdowns open from the right edge of their link, so the closed panel of the last link cannot hang
     past the viewport and cause sideways scroll */
  html body .ndn .ndn-primary .ndn-panel { left: auto; right: -8px; transform-origin: top right; }
}

/* 4b. Footer: one link column next to the brand left the right half of a 1440 footer empty, on the same
       ivory as the page. Sand band, links as a two-column block at the right edge, eyebrow-style heading
       (the plugin sets footer colours, letter-spacing and case with !important, hence the flags). */
html body .ndn-footer { background: var(--mr-sand, #EFE6D8) !important; border-top-color: var(--nd-line-strong, #DACFBF) !important; }
html body .ndn-footer .ndn-footer__title { font-size: 12px; letter-spacing: .2em !important; text-transform: uppercase !important; font-weight: 600; color: var(--mr-sage-dark, #4C5F45) !important; }
html body .ndn-footer .ndn-footer__tagline { color: #4E5348; }
html body .ndn-footer .ndn-footer__link { color: #363B31 !important; }
html body .ndn-footer .ndn-footer__link:hover { color: var(--mr-sage-dark, #4C5F45) !important; }
html body .ndn-footer .ndn-footer__bottom { border-top-color: var(--nd-line-strong, #DACFBF); }
html body .ndn-footer .ndn-footer__top-btn { background: rgba(255, 253, 249, .7); }
@media (min-width: 900px) {
  html body .ndn-footer .ndn-footer__top { grid-template-columns: minmax(260px, 1fr) auto; }
  html body .ndn-footer .ndn-footer__cols { grid-template-columns: auto; justify-content: end; }
  html body .ndn-footer .ndn-footer__list { grid-template-columns: repeat(2, auto); column-gap: clamp(40px, 6vw, 88px); }
}

/* ==========================================================================
   5. Home
   ========================================================================== */
/* 5a. Hero subtitle: thin white type straight on bright surf. Heavier weight and a tight dark halo. */
html body .mr-hero .mr-lede { font-weight: 500; text-shadow: 0 1px 2px rgba(35, 39, 31, .55), 0 0 22px rgba(35, 39, 31, .55), 0 0 60px rgba(35, 39, 31, .45); }
html body .mr-hero .mr-kicker { text-shadow: 0 1px 2px rgba(35, 39, 31, .5), 0 0 18px rgba(35, 39, 31, .5); }

/* ==========================================================================
   6. About and the site 404 (theme template pages, not rendered by the plugin)
   ========================================================================== */
/* 6a. Their header and footer are a second set of chrome: logo 14px off the plugin header's, links at a
       different weight, footer on white with large light links. Line both up with the plugin chrome
       (same gutters, nav on the right, sand footer). The padding rules live in the nexdemo layer because the
       Additional CSS sets them with !important there. */
@layer nexdemo {
  html body .wp-site-blocks .mr-site-header { padding-left: max(16px, 4%) !important; padding-right: max(16px, 4%) !important; }
  html body .wp-site-blocks .mr-site-footer { padding: clamp(40px, 6vw, 64px) max(16px, 4%) 32px !important; }
  @media (min-width: 1024px) {
    html body .wp-site-blocks .mr-site-header { padding-left: max(24px, 10%) !important; padding-right: max(24px, 10%) !important; }
    html body .wp-site-blocks .mr-site-footer { padding-left: max(24px, 10%) !important; padding-right: max(24px, 10%) !important; }
  }
  html body .wp-site-blocks .mr-site-footer .mr-footer-nav { gap: 4px clamp(40px, 6vw, 88px) !important; }
  html body .wp-site-blocks .mr-site-footer .mr-footer-nav a { color: #363B31 !important; }
  html body .wp-site-blocks .mr-site-footer .mr-footer-nav a:hover { color: var(--mr-sage-dark, #4C5F45) !important; }
}
html body .mr-site-header { justify-content: space-between; background: #FFFDF9; }
html body .mr-site-header .mr-site-nav { margin-left: auto; }
html body .mr-site-header .mr-site-nav .wp-block-navigation-item__content { font-weight: 500; }
html body .mr-site-header .wp-block-navigation__responsive-container-open { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--mr-ink, #23271F); }
/* same three-line menu mark as the plugin header (the theme's default is a two-line icon) */
html body .mr-site-header .wp-block-navigation__responsive-container-open svg { display: none; }
html body .mr-site-header .wp-block-navigation__responsive-container-open::before { content: ""; width: 18px; height: 2px; border-radius: 2px; background: currentColor; box-shadow: 0 -6px 0 currentColor, 0 6px 0 currentColor; }
@media (min-width: 600px) { html body .mr-site-header .wp-block-navigation__responsive-container-open { display: none; } }
html body .mr-site-footer { background: var(--mr-sand, #EFE6D8); border-top: 1px solid var(--nd-line-strong, #DACFBF); }
html body .mr-site-footer > * { max-width: none; }
html body .mr-site-footer .mr-footer-tag { font-weight: 400; color: #4E5348; }
html body .mr-site-footer .mr-footer-nav { display: grid; grid-template-columns: repeat(2, auto); }
html body .mr-site-footer .mr-footer-nav a { font-size: 15px; font-weight: 400; padding: 6px 0; display: block; }
html body .mr-site-footer .mr-footer-legal { font-size: 14px; font-weight: 400; color: #5B6054; border-top-color: var(--nd-line-strong, #DACFBF); }

/* 6b. About: H1 sat 20px left of the body text, the feature list was a raw browser bullet list at 22px,
       and the page had no relation to the rest of the site. One 760px column on the archive's dawn wash,
       H1 and text on the same edge, features as glass rows with a sage tick, brand buttons. */
/* (the two !important flags below beat inline styles the block editor wrote on these two elements) */
html body:has(.mr-about) .wp-site-blocks > main { margin-top: 0 !important; padding: clamp(56px, 8vw, 104px) 20px clamp(56px, 8vw, 96px); background: linear-gradient(180deg, #EFD8CE 0, #F2E4DA 150px, #F6EEE6 300px, #F8F4EE 460px); }
html body:has(.mr-about) .wp-site-blocks > main > .wp-block-group { padding: 0 !important; max-width: 760px; margin-left: auto; margin-right: auto; }
html body:has(.mr-about) .wp-block-post-title { max-width: 760px; margin: 0 auto 22px; font-weight: 400; font-size: clamp(2.4rem, 5.4vw, 4rem); line-height: 1.04; letter-spacing: -.035em; color: var(--mr-ink, #23271F); }
html body:has(.mr-about) .wp-site-blocks .entry-content { padding: 0; margin-left: 0; margin-right: 0; }
@layer nexdemo { html body .wp-site-blocks .entry-content .mr-about { padding: 0 !important; } }
html body .mr-about { max-width: 760px; margin-inline: auto; }
html body .mr-about > * { max-width: none; margin-left: 0; margin-right: 0; }
html body .mr-about > p:first-child { font-size: clamp(1.1rem, 1.5vw, 1.3rem); line-height: 1.55; font-weight: 400; color: #363B31; }
html body .mr-about > ul.wp-block-list { list-style: none; padding: 0; margin: 32px 0 28px; display: grid; gap: 10px; }
html body .mr-about > ul.wp-block-list > li { position: relative; margin: 0; padding: 15px 20px 15px 52px; font-size: 1rem; line-height: 1.5; font-weight: 400; color: #363B31; background: rgba(255, 253, 249, .8); border: 1px solid var(--nd-line, #E8DFD2); border-radius: 18px; }
html body .mr-about > ul.wp-block-list > li::before { content: ""; position: absolute; left: 18px; top: 17px; width: 20px; height: 20px; border-radius: 50%; background: rgba(94, 115, 86, .14); }
html body .mr-about > ul.wp-block-list > li::after { content: ""; position: absolute; left: 24px; top: 23px; width: 8px; height: 5px; border-left: 2px solid var(--mr-sage, #5E7356); border-bottom: 2px solid var(--mr-sage, #5E7356); transform: rotate(-45deg); }
html body .mr-about .mr-note { font-weight: 400; }
html body .mr-about .wp-block-buttons { gap: 10px; margin-top: 24px; }
html body .mr-about .wp-block-button__link { border-radius: 999px; padding: 13px 26px; font-size: .95rem; font-weight: 600; background: var(--mr-sage, #5E7356); color: #fff; border: 1px solid var(--mr-sage, #5E7356); }
html body .mr-about .wp-block-button__link:hover { background: var(--mr-sage-dark, #4C5F45); }
html body .mr-about .is-style-outline .wp-block-button__link { background: rgba(255, 253, 249, .75); color: var(--mr-sage-dark, #4C5F45); border-color: var(--nd-line-strong, #DACFBF); }
/* the last dropdown would hang past the right edge now that the links sit on the right */
html body .mr-site-header .mr-site-nav .wp-block-navigation__container > .wp-block-navigation-item:last-child > .wp-block-navigation__submenu-container { left: auto; right: 0; }

/* ==========================================================================
   7. "Just added" (What's new)
   ========================================================================== */
/* 7a. Subtitle: thin white type over the wave photo. Same halo as the home hero. */
html body .nd-whatsnew .nd-discover__hero .nd-discover__lede { font-weight: 500; text-shadow: 0 1px 2px rgba(35, 39, 31, .55), 0 0 22px rgba(35, 39, 31, .5); }
/* 7b. The feed ended with two competing controls: pagination (whose links leave the feed for page 2 of
       "Discover places") and a "View all places" button that goes to the same list. Keep the button. */
html body .nd-whatsnew .nexdirectory-pagination { display: none; }
