/* Additions to the old theme's styles for the parts the static site
   replaced: the email prompt (or contact form), the office map link, the
   account portal's park list, short notice pages, and fixes the old pages
   need without WordPress. Colours come from the theme's own variables so
   they match. */

/* The site's theme settings changed over the years the captures span: by
   2026 the header logo was switched off, but pages last captured in 2024
   still show it. Match the newest design everywhere. */
.ast-builder-layout-element[data-section="title_tagline"] { display: none; }

/* Main menu: a visible hover and current-page state. The theme's own were
   the same navy as the links, so they didn't show. */
.ast-builder-menu .main-header-menu .menu-item > .menu-link { transition: color .15s ease; }
.ast-builder-menu .main-header-menu .menu-item:hover > .menu-link,
.ast-builder-menu .main-header-menu .menu-item.focus > .menu-link,
.ast-builder-menu .main-header-menu .menu-item > .menu-link:focus-visible,
.ast-builder-menu .main-header-menu .current-menu-item > .menu-link,
.ast-builder-menu .main-header-menu .current-menu-ancestor > .menu-link {
  color: var(--ast-global-color-2, #41bb9d);
}
.ast-desktop .ast-builder-menu .main-header-menu > .current-menu-item > .menu-link,
.ast-desktop .ast-builder-menu .main-header-menu > .current-menu-ancestor > .menu-link {
  box-shadow: inset 0 -2px 0 currentColor;
}

/* A button in the site's teal, for blocks the static site adds. */
.cw-button {
  display: inline-block; padding: 12px 24px; border-radius: 10px; text-decoration: none; font-weight: 600;
  background: var(--ast-global-color-2, #41bb9d); color: #fff;
}
.cw-button:hover, .cw-button:focus-visible { background: var(--ast-global-color-0, #202e5c); color: #fff; }

/* "Email us" in place of the old enquiry forms, and JotForm links. */
.cw-email-us, .cw-jotform {
  max-width: 640px; margin: 20px auto; padding: 28px; background: #fff; border-radius: 10px;
  text-align: center; box-sizing: border-box;
}
.cw-email-us p:last-child, .cw-jotform p:last-child { margin-bottom: 0; }
.cw-jotform h2 { margin-top: 0; }

/* Contact form (switched off until Resend is set up). A white rounded
   card, like the other content blocks in the design. */
.contact-form { max-width: 640px; margin: 20px auto; padding: 28px; background: #fff; border-radius: 10px; text-align: left; box-sizing: border-box; }
.contact-form .field { margin-bottom: 14px; }
.contact-form label { display: block; font-weight: 600; margin-bottom: 4px; color: var(--ast-global-color-0, #202e5c); }
.contact-form .opt { font-weight: 400; opacity: .75; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; box-sizing: border-box; }
.contact-form .form-intro, .contact-form .form-privacy { font-size: .9em; opacity: .85; }
.contact-form .hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-form .form-status { margin: 12px 0 0; font-weight: 600; }
.contact-form .form-status.error { color: #b3261e; }
.contact-form .form-status.ok { color: var(--ast-global-color-2, #41bb9d); }
.contact-form .cf-turnstile { margin-bottom: 14px; }

.static-map {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  min-height: 260px; border-radius: 8px; text-decoration: none; text-align: center;
  background: var(--ast-global-color-4, #f0f0f0); color: var(--ast-global-color-0, #202e5c);
}
.static-map strong { font-size: 1.2em; }
.static-map:hover span { text-decoration: underline; }

/* Account portal: "Select your Park" opens the list of park login portals
   as a panel over the page, like the old flyout menu. The widget's negative
   margins were sized for the old 200px flyout icon and would pull the
   button over the card's text, so they're dropped. */
.elementor-widget-container:has(> .park-picker) { margin: 0 !important; }
.park-picker { position: relative; z-index: 5; }
.park-picker summary {
  display: inline-block; cursor: pointer; list-style: none; padding: 12px 24px; border-radius: 10px;
  background: var(--ast-global-color-2, #41bb9d); color: #fff; font-weight: 600;
}
.park-picker summary:hover, .park-picker summary:focus-visible { background: var(--ast-global-color-0, #202e5c); }
.park-picker summary::-webkit-details-marker { display: none; }
.park-picker summary::after { content: " ▾"; }
.park-picker[open] summary::after { content: " ▴"; }
/* A grid rather than CSS columns: columns with a max-height spill sideways
   instead of scrolling. */
.park-picker .link-list {
  position: absolute; top: calc(100% + 8px); left: 0; width: min(560px, 86vw); max-height: 60vh; overflow: auto;
  margin: 0; padding: 16px 20px 16px 36px; background: #fff; border-radius: 10px;
  box-shadow: 0 12px 32px rgba(32, 46, 92, .2); box-sizing: border-box;
  columns: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); column-gap: 32px;
}
@media (max-width: 767px) { .park-picker { text-align: center; } } /* the card's text centres on phones */
.link-list { columns: 2 180px; margin: 0; padding-left: 1.2em; text-align: left; }
.link-list li { break-inside: avoid; margin-bottom: 4px; }

.static-note { max-width: 760px; margin: 0 auto; padding: 60px 20px; }

/* Pages whose own Elementor stylesheet was lost (see build-report.txt) get
   readable defaults instead of Elementor's bare ones. */
.cw-no-page-css .elementor-widget-heading .elementor-heading-title {
  font-size: clamp(1.6rem, 3vw, 2.4rem); text-align: center;
}
.cw-no-page-css .elementor-widget-text-editor { max-width: 720px; margin: 0 auto; text-align: center; font-size: 1.05rem; }
.cw-no-page-css .elementor-widget-image { text-align: center; }
.cw-no-page-css .elementor-section .elementor-container { padding: 0 20px; }

/* Background slideshow (rebuilt markup, rotated by site.js). */
.static-slideshow { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.static-slideshow .elementor-background-slideshow__slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; }
.static-slideshow .elementor-background-slideshow__slide.is-active { opacity: 1; }
.static-slideshow .elementor-background-slideshow__slide__image { width: 100%; height: 100%; background-size: cover; background-position: center; }
@media (prefers-reduced-motion: reduce) { .static-slideshow .elementor-background-slideshow__slide { transition: none; } }

/* Elementor's accordion and toggle titles are clickable again (site.js). */
.elementor-tab-title { cursor: pointer; }