/* NexDemo Polish: culture (Velvet Hour, after-dark culture season, Vienna).
   Loaded after the plugin CSS, the site's Additional CSS (again, in @layer nexdemo) and common.css.
   Identity kept: gold #C9A227 on near-black #0E0A0B, burgundy #5E0B15, Playfair Display, candlelit photography.
   Fixes, one line each:
    1. Home hero on phones: flame moved off the copy and a soft scrim added, so "dark" and the eyebrow can be read; second button clears the tab bar.
    2. About page: header and footer get the plugin's own tokens back (they fell back to 22px Manrope and a 10% inset); body copy size matched.
    3. Archive pagination: page links readable (were dark red on near-black).
    4. Archive hero: navy strip under the header removed; photo warmed and darkened behind the heading.
    5. Home "The next five nights": "All 24 events" sits right; large card fills both rows; date lines readable on bright photos.
    6. Home "Something candlelit on Friday?": form restyled to the dark brand with square gold / ghost buttons and one tidy row; results in two columns.
    7. Home embedded calendar: breadcrumb, second H1 "Calendar", lede and dead-end "+ Add event" hidden; embed aligned to the section column and made compact.
    8. Listing page: dead-end "Log in to build your own agenda" hidden; When / Where / Entry strip and gallery aligned to the 700px copy column;
       single dark band colour on phones; related titles in Playfair; euro sign legible; sticky bar sits on the bottom edge on phones.
    9. Header: only one top-level item is marked current; on home, hero copy, logo and footer line up with the 1240px column;
       no lighter rectangle where the header crosses the flame.
   10. Listing hero: title separated from the flame with a soft shadow.
   Not fixed here (content, data or plugin): see content-todo-culture.md. */

/* ---------- 1. Home hero on phones ----------
   Defect: the gold word "dark" and the eyebrow sat on the bright candle flame and could not be read;
   the second button was hidden behind the tab bar. */
@media (max-width: 781px) {
  html body .vh-hero .wp-block-cover__video-background { object-position: 22% 50%; }
  html body .vh-hero .wp-block-cover__inner-container { padding-bottom: 56px; }
  html body .vh-hero .wp-block-cover__inner-container::before {
    content: ""; position: absolute; z-index: -1; left: -30px; right: -30px; top: -200px; bottom: -80px; pointer-events: none;
    background: linear-gradient(180deg, rgba(14,10,11,0) 0, rgba(14,10,11,.35) 110px, rgba(14,10,11,.7) 220px, rgba(14,10,11,.88) 60%, rgba(14,10,11,.96) 100%);
  }
}

/* ---------- 2. About page: header and footer ----------
   Defect: the About page has no plugin block on it, so the plugin's design tokens are never loaded there. The header and
   footer fell back to the theme's 22px Manrope, a 10% inset and different link sizes. These are the same token values
   the plugin prints on every other page of this site; they only apply where the header is printed outside the plugin UI scope. */
html:root:has(body > .ndn) {
  --nd-font: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --nd-font-display: "Playfair Display", Georgia, serif;
  --nd-ink: #F4EDE1; --nd-accent: #C9A227; --nd-on-accent: #14090B; --nd-surface: #1A1214;
  --nd-danger: #dc2626; --nd-success: #12a150;
  --nd-page-x: max(24px, calc((100vw - 1380px) / 2 + 24px));
  --nd-radius-xs: 6px; --nd-radius-sm: 10px; --nd-radius: 8px; --nd-radius-lg: 8px; --nd-radius-xl: 16px; --nd-radius-pill: 999px;
  --nd-fs-12: .75rem; --nd-fs-13: .8125rem; --nd-fs-14: .875rem;
  --nd-dur-1: 120ms; --nd-dur-2: 200ms; --nd-dur-3: 320ms;
  --nd-ease: cubic-bezier(.2, .8, .2, 1); --nd-ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --nd-shadow-1: 0 1px 2px rgba(15, 23, 42, .05); --nd-shadow-2: 0 8px 18px rgba(11, 18, 33, .09); --nd-shadow-4: 0 24px 50px rgba(11, 18, 33, .2);
  --nd-ring: 0 0 0 3px rgba(201, 162, 39, .28);
  --nd-tabbar-h: 64px; --nd-safe-bottom: env(safe-area-inset-bottom, 0px); --nd-z-tabbar: 99990;
}
html body > .ndn, html body > .ndn-footer, html body > .ndn-tabbar,
html body > .ndn *, html body > .ndn-footer *, html body > .ndn-tabbar * { box-sizing: border-box; }
/* Defect: About body copy ran at the theme's 22px while the rest of the site reads at 17-19px. */
html body .vh-about > p:not(.vh-eyebrow):not(.vh-kicker):not(.vh-small),
html body .vh-about li { font-size: 1.12rem; line-height: 1.65; }

/* ---------- 3. Archive pagination ----------
   Defect: page "2" and "Next" were dark red (#5E0B15) on near-black and close to invisible. */
/* (the plugin sets link colour to "inherit" with an id selector, so these rules carry the id too) */
html body #nexdirectory-app .nexdirectory-pagination ul.page-numbers { color: #F4EDE1; background: transparent; border: 0; box-shadow: none; }
html body #nexdirectory-app .nexdirectory-pagination a.page-numbers,
html body #nexdirectory-app .nexdirectory-pagination span.page-numbers:not(.current) { color: #F4EDE1; background: #1A1214; border-color: #3D2D30; box-shadow: none; }
html body #nexdirectory-app .nexdirectory-pagination a.page-numbers:hover { color: #C9A227; border-color: #C9A227; background: #1A1214; }

/* ---------- 4. Archive hero ----------
   Defect: the parallax script shifts the photo and leaves a navy strip under the header; the cool blue tint fights the warm palette. */
html body .nd-discover__hero-media { background: #0E0A0B; }
html body .nd-discover__hero-media img { transform: none !important; filter: sepia(.35) saturate(1.1) brightness(.9); }
html body .nd-discover__hero-media::after { background: linear-gradient(90deg, rgba(14,10,11,.88) 0%, rgba(14,10,11,.6) 50%, rgba(14,10,11,.3) 100%), linear-gradient(180deg, rgba(14,10,11,0) 55%, rgba(14,10,11,.75) 100%); }

/* ---------- 5. Home: "The next five nights" ----------
   Defect: "All 24 events" floated mid-row; the large card was shorter than the two-row stack beside it (hole bottom-left);
   gold date lines disappeared on bright photos. */
html body.home .vh-head > .vh-more { margin-left: auto; }
html body.home .nexdirectory-widget-results--bento { align-items: stretch; }
html body .nxd-ui .nd-ecard--poster .nd-ecard__shade { background: linear-gradient(rgba(14,10,11,.25) 0%, rgba(14,10,11,0) 26%, rgba(14,10,11,0) 36%, rgba(14,10,11,.55) 62%, rgba(14,10,11,.9) 100%); }
html body .nxd-ui .nd-ecard--poster .nd-ecard__when { text-shadow: 0 1px 2px rgba(0,0,0,.85), 0 0 12px rgba(0,0,0,.6); }

/* ---------- 6. Home: "Something candlelit on Friday?" ----------
   Defect: generic rounded form with a white-on-gold pill button (contrast 2.4:1) and a native date control;
   results were full-width rows with most of the row empty. */
html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-form { background: #140D0F; border: 1px solid #2C2022; border-radius: 0; box-shadow: none; padding: 20px; gap: 12px; }
html body .vh-find .nexdirectory-widget-search-block :is(input, select) { background-color: #0E0A0B; border: 1px solid #3D2D30; border-radius: 0; color: #F4EDE1; min-height: 48px; font-size: 15px; color-scheme: dark; }
html body .vh-find .nexdirectory-widget-search-block :is(input, select):focus { outline: 0; border-color: #C9A227; box-shadow: 0 0 0 1px #C9A227; }
html body .vh-find .nexdirectory-widget-search-block input::placeholder { color: #8A7E72; }
html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-actions .nexdirectory-btn { border-radius: 0; min-height: 48px; padding: 0 26px; font: 600 15px/1.2 Inter, system-ui, sans-serif; letter-spacing: .02em; box-shadow: none; }
html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-actions .nexdirectory-btn:not(.nexdirectory-btn-secondary) { background: #C9A227; border: 1px solid #C9A227; color: #14090B !important; -webkit-text-fill-color: #14090B; }
html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-actions .nexdirectory-btn:not(.nexdirectory-btn-secondary):hover { background: #E2C15A; }
html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-actions .nexdirectory-btn-secondary { background: transparent; border: 1px solid rgba(244,237,225,.55); color: #F4EDE1 !important; -webkit-text-fill-color: #F4EDE1; }
html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-actions .nexdirectory-btn-secondary:hover { border-color: #C9A227; color: #C9A227 !important; -webkit-text-fill-color: #C9A227; }
html body .vh-find .nexdirectory-widget-block .nexdirectory-widget-count { font: 600 12px/1.4 Inter, system-ui, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #B9AC9C; }
@media (min-width: 1100px) {
  html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-form { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-fields { display: contents; }
  html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-fields > input[type="text"]:first-of-type { grid-column: 1 / span 4; grid-row: 1; }
  html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-actions { grid-column: 5 / span 2; grid-row: 1; }
  html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-actions .nexdirectory-btn { flex: 1 1 0; }
  html body .vh-find .nexdirectory-widget-block .nd-results--horizontal { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 640px) {
  html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body .vh-find .nexdirectory-widget-search-block .nexdirectory-widget-search-actions .nexdirectory-btn { flex: 1 1 0; }
}

/* ---------- 7. Home: embedded calendar ----------
   Defect: the embed brought its own page header into the home page: breadcrumb "Home / Calendar", a second H1 "Calendar",
   a lede, and "+ Add event" (a dead end: posting is off). It also sat 54px inside the section column. */
html body.home .vh-cal .nd-cal2__headtext { display: none; }
html body .nd-cal2__headactions > a.nd-btn--primary[href$="/submit/"] { display: none; }
html body.home .vh-cal .nd-cal2 { padding-left: 0; padding-right: 0; padding-bottom: 0; }
html body.home .vh-cal .nd-cal2__head { padding: 8px 0 16px; justify-content: flex-end; }
@media (min-width: 768px) {
  html body.home .vh-cal .nd-cal__cell { min-height: 96px; }
}

/* ---------- 8. Listing page ---------- */
/* Dead end: accounts are off on this demo, so "Log in to build your own agenda and keep session notes." leads nowhere. */
html body .nds-agenda__hint { display: none; }
/* Defect: the gallery and the When / Where / Entry strip sat hard left at 54px while the copy is a centred 700px column. */
@media (min-width: 1024px) {
  html body .nds--cinematic .nds-strip__inner { padding-left: max(54px, calc((100% - 700px) / 2)); padding-right: max(54px, calc((100% - 700px) / 2)); justify-content: space-between; }
  html body .nds--cinematic .nds-gallery--rail { max-width: 700px; margin-left: auto; margin-right: auto; }
  html body .nds--cinematic .nds-gallery--rail .nds-gallery__grid { grid-auto-columns: calc((100% - 12px) / 2); }
}
/* Defect: on phones the page alternated blue-black (plugin default) and brown-black bands. */
html body .nds--cinematic .nds-body { background: #1A1214; }
html body .nds--cinematic .nds-full--cinematic { background: #0E0A0B; }
/* Defect: related-event titles were bold Inter while every other event title is Playfair. */
html body .nds-relcard__title { font-family: "Playfair Display", Georgia, serif; font-weight: 600; font-size: 17px; letter-spacing: 0; }
/* Defect: in Playfair the euro sign in the Entry price read as a "C" ("C19-C68"). */
html body .nds-strip__item:last-child .nds-strip__v { font-family: Inter, system-ui, sans-serif; font-weight: 600; letter-spacing: -.01em; }
/* Defect (plugin, phones): the tab bar is hidden on listing pages but its 64px is still reserved, so the sticky
   action bar floated above the bottom edge with page content showing underneath. */
@media (max-width: 767px) {
  html.ndn-has-tabbar:has(.nds) { --nd-bottom-stack: var(--nd-safe-bottom, 0px); }
}

/* ---------- 9. Header ----------
   Defect: "Explore events" and "More" were both underlined as the current page (both menus contain the same link). */
html body .ndn .ndn-menu__item:has(.ndn-trigger.is-current) ~ .ndn-menu__item .ndn-trigger.is-current::after { transform: scaleX(0); }
/* Defect: on the home page the hero copy started at 50px, the logo and footer at 54px and every section at the 1240px column edge. */
html body .wp-block-cover.vh-hero.has-custom-content-position.has-custom-content-position.is-position-bottom-left .wp-block-cover__inner-container { margin-left: auto; margin-right: auto; width: 100%; }
@media (min-width: 1024px) {
  html body.home .ndn { --ndn-pad: max(max(24px, 4vw), calc((100vw - var(--ndn-sbw, 0px) - 1240px) / 2)); }
  html body.home .ndn-footer { --ndn-fpad: max(max(24px, 4vw), calc((100vw - var(--ndn-sbw, 0px) - 1240px) / 2)); }
}

/* ---------- 10. Listing hero ----------
   Defect: the white title crosses the brightest part of the flame photo. */
html body .nds--cinematic .nds-title--display { text-shadow: 0 2px 28px rgba(0, 0, 0, .6), 0 1px 2px rgba(0, 0, 0, .5); }
/* Defect: the header's blur drew a lighter rectangle where it crossed the flame; hero copy needs a little separation from the flame. */
html body.home .vh-next .ndn::before { -webkit-backdrop-filter: none; backdrop-filter: none; }
html body .vh-hero :is(.vh-kicker, .vh-display, .vh-lede) { text-shadow: 0 1px 22px rgba(14, 10, 11, .8), 0 1px 2px rgba(14, 10, 11, .55); }