/* FlyHappy V5.27: fluid public-page content with a consistent responsive edge gutter.
   Backgrounds remain full-bleed; only the inside of each section receives gutters.
   No admin styles or form/booking behaviour are modified. */
:root {
  --fh-fluid-edge: clamp(15px, 2.8vw, 58px);
}

/* These are the existing containers used by the homepage, shared PHP templates,
   featured routes/destinations, Why FlyHappy, flight and hotel results/details,
   and the destination PPC landing sections. Replace their desktop width ceilings
   without turning text/cards into edge-to-edge elements. */
body .section > .container,
body .section > .container-fluid,
body .fh-home-page .section > .container,
body.fh-home-page .section > .container,
body.fh-home-page .banner-search-four > .container,
body.fh-home-page .hero-section-four > .container,
body .fhv5-section > .fhv5-container,
body .fhv5-page-hero > .fhv5-container,
body .fhv5-home-hero > .fhv5-container,
body .fhv5-search-wrap > .fhv5-container,
body .fhv5-home-trust > .fhv5-container,
body .fh-trust-strip > .container,
body .fh-destination-enquiry > .fhv5-container,
body .fh-featured-section > .fhv58-content-width,
body .fhv58-content-width,
body .fh-dpp .fh-dpp-container,
body main > .container,
body main > .fhv5-container,
body .fhv5-footer > .fhv5-container,
body .fh-home-page .banner-search-four > .container {
  box-sizing: border-box;
  width: calc(100% - (var(--fh-fluid-edge) * 2)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

/* Match the already full-width header/footer to the same content edges on large
   screens without altering the compact tablet/mobile navigation breakpoints. */
@media (min-width: 1400px) {
  body .fhv5-header .fhv5-header-inner {
    width: calc(100% - (var(--fh-fluid-edge) * 2)) !important;
    max-width: none !important;
    padding-left: 0;
    padding-right: 0;
  }
}

/* The old hotel results width cap overrode the rest of the frontend layout. */
body.fh-hotel-results .fh-hotel-results-container,
body .fh-hotel-results .fh-hotel-results-container {
  width: calc(100% - (var(--fh-fluid-edge) * 2)) !important;
  max-width: none !important;
  padding-inline: 0 !important;
}

/* Give detail/results grids the new room while preventing intrinsic-size overflow. */
body .fh-results-layout,
body .fh-results-layout > *,
body .fh-hotel-results-grid,
body .fh-hotel-results-grid > *,
body .fh-featured-grid > *,
body .fhv5-dest-grid > *,
body .fhv5-hotel-grid > *,
body .fh-dpp-container > * {
  min-width: 0;
}

/* Content cards on text-heavy interior pages were additionally constrained to
   Bootstrap 9/10-column wrappers. Expand the cards, not hero text or forms. */
@media (min-width: 992px) {
  body .section > .container > .row > .col-lg-9.mx-auto:has(> .fh-content-card),
  body .section > .container > .row > .col-lg-10:has(> .fh-content-card),
  body .section > .fhv5-container > .row > .col-lg-9.mx-auto:has(> .fh-content-card),
  body .section > .fhv5-container > .row > .col-xl-9.mx-auto:has(> .section-header) {
    width: 100%;
    max-width: none;
  }
}

/* The overall page is fluid, while long uninterrupted paragraphs remain readable. */
body .fh-content-card .seo-copy-wrap > p,
body .fh-content-card .seo-copy-block > p,
body .fh-dpp-guide .seo-copy-wrap > p {
  max-width: 112ch;
}

@media (max-width: 767.98px) {
  :root { --fh-fluid-edge: 13px; }
  /* Let the existing one/two-column mobile card and form breakpoints win. */
  body .fhv5-section,
  body .fh-dpp-section { overflow-wrap: break-word; }
  body .fh-dpp .fh-dpp-container { min-width: 0; }
}

/* FlyHappy V5.33 WCAG contrast: keep the approved orange backgrounds, but use
   dark navy text instead of low-contrast white (previously ~1.8-2.9:1). */
.fh-btn-orange,.fh-btn-orange:hover,.fh-btn-orange:focus-visible,
.banner-search-four button[type="submit"],.banner-search-four button[type="submit"]:hover,.banner-search-four button[type="submit"]:focus-visible,
.fhv5-header .fhv5-call,.fhv5-header .fhv5-call:hover,.fhv5-header .fhv5-call:focus-visible,
.fh-flight-select,.fh-flight-select:hover,.fh-flight-select:focus-visible,
body.fh-home-page .btn-primary,body.fh-home-page .btn-primary:hover,body.fh-home-page .btn-primary:focus-visible {
  color:#082b43!important;
}