/**
 * Genesis/WP layout + bulletproof header/nav for Treflyn Barn.
 * Loaded last so it wins over parent/theme conflicts.
 */

/* —— Block editor content on homepage (blocks / hybrid modes) —— */
body.treflyn-barn-theme .tb-blocks-main {
  padding: calc(var(--nav-h, 90px) + 2.5rem) 0 4rem;
  min-height: 50vh;
}

body.treflyn-barn-theme .tb-blocks-inner {
  max-width: var(--max, 1180px);
}

body.treflyn-barn-theme .tb-blocks-content,
body.treflyn-barn-theme .tb-hybrid-blocks .entry-content,
body.treflyn-barn-theme .tb-blocks-inner > .tb-blocks-content {
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--ink-soft, #3a3834);
}

body.treflyn-barn-theme .tb-blocks-content h1,
body.treflyn-barn-theme .tb-blocks-content h2,
body.treflyn-barn-theme .tb-hybrid-blocks h1,
body.treflyn-barn-theme .tb-hybrid-blocks h2 {
  font-family: var(--font-display, Georgia, serif);
  color: var(--forest, #0f1c16);
  font-weight: 500;
}

body.treflyn-barn-theme .tb-block-booking,
body.treflyn-barn-theme .tb-block-gallery {
  margin: 2rem 0;
}

body.treflyn-barn-theme .tb-block-booking-panel {
  max-width: 640px;
  margin-inline: auto;
  background: var(--paper, #fffcf8);
  border: 1px solid var(--line, rgba(15, 28, 22, 0.09));
  border-radius: var(--radius-lg, 22px);
  padding: 1.75rem 1.5rem;
  box-shadow: var(--shadow-sm, 0 4px 20px rgba(15, 20, 16, 0.05));
}

body.treflyn-barn-theme .tb-hybrid-blocks {
  background: var(--ivory-2, #f0ebe3);
  border-top: 1px solid var(--line, rgba(15, 28, 22, 0.09));
}

/* Native WP blocks inside theme */
body.treflyn-barn-theme .wp-block-button__link {
  border-radius: 999px;
}

/* —— Layout shells —— */
body.treflyn-barn-theme .site-container,
body.treflyn-barn-theme .site-inner,
body.tb-static-front .site-container,
body.tb-static-front .site-inner {
  max-width: none !important;
  width: 100% !important;
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  position: relative;
}

body.tb-static-front .content-sidebar-wrap,
body.tb-static-front .content,
body.tb-static-front .sidebar,
body.tb-static-front #genesis-content {
  display: none !important;
}

/* Hide broken Genesis skip links (target missing IDs) */
body.treflyn-barn-theme .genesis-skip-link {
  display: none !important;
}

/* —— Sticky header —— */
body.treflyn-barn-theme .site-header.tb-header,
body.treflyn-barn-theme .site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: var(--nav-h, 90px) !important;
  z-index: 10050 !important;
  float: none !important;
  background: transparent;
  border: 0;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}

body.treflyn-barn-theme .site-header.scrolled {
  background: rgba(250, 247, 242, 0.96) !important;
  backdrop-filter: blur(18px) saturate(1.15);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  border-bottom: 1px solid rgba(15, 28, 22, 0.1) !important;
  box-shadow: 0 10px 36px rgba(15, 20, 16, 0.07);
}

/* Bar layout: logo | nav | (toggle on small) */
body.treflyn-barn-theme .tb-nav-bar,
body.treflyn-barn-theme .site-header .nav {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 1rem !important;
  height: 100% !important;
  width: 100% !important;
  max-width: var(--max, 1180px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  box-sizing: border-box;
}

body.treflyn-barn-theme .site-header .logo {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  text-decoration: none !important;
  color: #fffcf8 !important;
  min-width: 0;
  z-index: 2;
}

body.treflyn-barn-theme .site-header.scrolled .logo {
  color: #0f1c16 !important;
}

body.treflyn-barn-theme .site-header .logo-name,
body.treflyn-barn-theme .site-header .logo-tag {
  color: inherit !important;
}

/* Kill WP / block-theme link chrome inside header */
body.treflyn-barn-theme .site-header a,
body.treflyn-barn-theme .site-header a:hover,
body.treflyn-barn-theme .site-header a:focus,
body.treflyn-barn-theme .site-header a:visited {
  text-decoration: none !important;
  box-shadow: none !important;
  outline-offset: 3px;
  border: 0 !important;
  background-image: none !important;
}

/* Desktop / tablet nav strip */
body.treflyn-barn-theme .site-header .nav-links {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 0.1rem !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  padding: 0.28rem !important;
  border-radius: 999px !important;
  background: rgba(255, 252, 248, 0.1) !important;
  border: 1px solid rgba(255, 252, 248, 0.16) !important;
  list-style: none !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  position: static !important;
  transform: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  z-index: 2 !important;
  box-sizing: border-box;
}

body.treflyn-barn-theme .site-header.scrolled .nav-links {
  background: rgba(15, 28, 22, 0.04) !important;
  border-color: rgba(15, 28, 22, 0.1) !important;
}

body.treflyn-barn-theme .site-header .nav-links a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.52rem 0.78rem !important;
  margin: 0 !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.03em !important;
  line-height: 1.2 !important;
  color: rgba(255, 252, 248, 0.9) !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  transition: background 0.18s ease, color 0.18s ease !important;
}

body.treflyn-barn-theme .site-header.scrolled .nav-links a {
  color: #3a3834 !important;
}

body.treflyn-barn-theme .site-header .nav-links a:hover,
body.treflyn-barn-theme .site-header .nav-links a.active:not(.nav-cta) {
  color: #fffcf8 !important;
  background: rgba(255, 252, 248, 0.14) !important;
}

body.treflyn-barn-theme .site-header.scrolled .nav-links a:hover,
body.treflyn-barn-theme .site-header.scrolled .nav-links a.active:not(.nav-cta) {
  color: #0f1c16 !important;
  background: rgba(15, 28, 22, 0.07) !important;
}

body.treflyn-barn-theme .site-header .nav-links a.nav-cta {
  padding: 0.55rem 1.1rem !important;
  margin-left: 0.2rem !important;
  background: linear-gradient(135deg, #c9a66b, #d4b07a) !important;
  color: #0f1c16 !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  box-shadow: 0 6px 16px rgba(201, 166, 107, 0.32) !important;
}

body.treflyn-barn-theme .site-header.scrolled .nav-links a.nav-cta {
  background: #0f1c16 !important;
  color: #fffcf8 !important;
  box-shadow: 0 6px 16px rgba(15, 28, 22, 0.18) !important;
}

body.treflyn-barn-theme .site-header .nav-links a.nav-cta:hover {
  filter: brightness(1.06);
}

/* Hamburger — hidden on large screens */
body.treflyn-barn-theme .site-header .nav-toggle {
  display: none !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 46px !important;
  height: 46px !important;
  margin-left: 0.35rem !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 252, 248, 0.3) !important;
  border-radius: 12px !important;
  background: rgba(255, 252, 248, 0.1) !important;
  cursor: pointer !important;
  z-index: 10060 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

body.treflyn-barn-theme .site-header.scrolled .nav-toggle {
  border-color: rgba(15, 28, 22, 0.14) !important;
  background: rgba(15, 28, 22, 0.04) !important;
}

body.treflyn-barn-theme .site-header .nav-toggle span {
  display: block !important;
  width: 18px !important;
  height: 1.5px !important;
  margin: 4px auto !important;
  background: #fffcf8 !important;
  border-radius: 2px !important;
  transition: transform 0.28s ease, opacity 0.2s ease !important;
}

body.treflyn-barn-theme .site-header.scrolled .nav-toggle span,
body.nav-open .site-header .nav-toggle span {
  background: #0f1c16 !important;
}

body.nav-open .site-header .nav-toggle {
  background: #faf7f2 !important;
  border-color: rgba(15, 28, 22, 0.14) !important;
}

body.nav-open .site-header .nav-toggle span:nth-child(1) {
  transform: translateY(5.5px) rotate(45deg) !important;
}
body.nav-open .site-header .nav-toggle span:nth-child(2) {
  opacity: 0 !important;
}
body.nav-open .site-header .nav-toggle span:nth-child(3) {
  transform: translateY(-5.5px) rotate(-45deg) !important;
}

/* Overlay */
body.treflyn-barn-theme .nav-overlay {
  display: none !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 10040 !important;
  background: rgba(8, 12, 10, 0.5) !important;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.treflyn-barn-theme .nav-overlay.open,
body.nav-open .nav-overlay {
  display: block !important;
}

/* —— Mobile / compact: drawer menu —— */
@media (max-width: 1120px) {
  body.treflyn-barn-theme .site-header .logo-tag,
  body.treflyn-barn-theme .site-header .logo-rule {
    display: none !important;
  }

  body.treflyn-barn-theme .site-header .logo-name {
    font-size: 1.45rem !important;
  }

  body.treflyn-barn-theme .site-header .logo-mark {
    width: 46px !important;
    height: 46px !important;
  }

  body.treflyn-barn-theme .site-header .nav-toggle {
    display: inline-flex !important;
    flex-direction: column !important;
    margin-left: auto !important;
  }

  body.treflyn-barn-theme .site-header .nav-links {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: 0 !important;
    width: min(320px, 88vw) !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    margin: 0 !important;
    padding: calc(var(--nav-h, 90px) + 1rem) 1.25rem 2rem !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0.15rem !important;
    border-radius: 0 !important;
    border: none !important;
    border-left: 1px solid rgba(15, 28, 22, 0.1) !important;
    background: #faf7f2 !important;
    box-shadow: -18px 0 48px rgba(0, 0, 0, 0.16) !important;
    transform: translate3d(104%, 0, 0) !important;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1) !important;
    z-index: 10055 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body.treflyn-barn-theme .site-header .nav-links.open,
  body.nav-open .site-header .nav-links {
    transform: translate3d(0, 0, 0) !important;
  }

  body.treflyn-barn-theme .site-header .nav-links a {
    width: 100% !important;
    justify-content: flex-start !important;
    padding: 0.95rem 1rem !important;
    font-size: 1.02rem !important;
    color: #3a3834 !important;
    border-radius: 12px !important;
    background: transparent !important;
  }

  body.treflyn-barn-theme .site-header .nav-links a:hover,
  body.treflyn-barn-theme .site-header .nav-links a.active:not(.nav-cta) {
    color: #0f1c16 !important;
    background: rgba(15, 28, 22, 0.06) !important;
  }

  body.treflyn-barn-theme .site-header .nav-links a.nav-cta {
    margin: 0.85rem 0 0 !important;
    justify-content: center !important;
    padding: 1rem !important;
    background: #0f1c16 !important;
    color: #fffcf8 !important;
    box-shadow: none !important;
    text-transform: uppercase !important;
  }

  body.treflyn-barn-theme .site-header.scrolled .nav-links a {
    color: #3a3834 !important;
  }

  body.treflyn-barn-theme .site-header.scrolled .nav-links a.nav-cta {
    background: #0f1c16 !important;
    color: #fffcf8 !important;
  }

  body.nav-open {
    overflow: hidden !important;
  }
}

/* Mid desktop: slightly tighter pills so 6 links fit without wrapping */
@media (min-width: 1121px) and (max-width: 1280px) {
  body.treflyn-barn-theme .site-header .nav-links a {
    padding: 0.48rem 0.62rem !important;
    font-size: 0.74rem !important;
  }

  body.treflyn-barn-theme .site-header .logo-tag {
    display: none !important;
  }
}

/* Anchors clear fixed bar */
html {
  scroll-padding-top: calc(var(--nav-h, 90px) + 12px);
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

/* —— Images: never collapse under WP global styles —— */
/* Do NOT force height:auto on every img — that kills object-fit covers. */
body.treflyn-barn-theme .content img,
body.treflyn-barn-theme .entry-content img {
  max-width: 100%;
  height: auto;
}

/* Hero full-bleed slides */
body.treflyn-barn-theme .hero {
  position: relative !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
}

body.treflyn-barn-theme .hero-slides {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
}

body.treflyn-barn-theme .hero-slide {
  position: absolute !important;
  inset: 0 !important;
}

body.treflyn-barn-theme .hero-slide.active {
  opacity: 1 !important;
  z-index: 1 !important;
}

body.treflyn-barn-theme .hero-slide img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center 40% !important;
}

/* Gallery + sleep cards need height:100% for object-fit */
body.treflyn-barn-theme .gallery-item,
body.treflyn-barn-theme .sleep-img,
body.treflyn-barn-theme .about-visual,
body.treflyn-barn-theme .about-mosaic figure {
  position: relative !important;
  overflow: hidden !important;
}

body.treflyn-barn-theme .gallery-item img,
body.treflyn-barn-theme .sleep-img img,
body.treflyn-barn-theme .about-visual img,
body.treflyn-barn-theme .about-mosaic img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
}

body.treflyn-barn-theme .host-photo {
  display: block !important;
  width: 96px !important;
  height: 96px !important;
  max-width: none !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}

/* CSS background photos (experience + final CTA + booking aside) */
body.treflyn-barn-theme .exp-visual {
  display: block !important;
  min-height: 200px !important;
  height: 200px !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

body.treflyn-barn-theme .final-cta-bg {
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

body.treflyn-barn-theme .booking-aside {
  background-size: cover !important;
  background-position: center !important;
}

/*
 * Scroll-reveal can leave blocks at opacity:0 if JS is blocked/late.
 * Fail open: show content immediately, keep a soft transition when .visible lands.
 */
body.treflyn-barn-theme .reveal,
body.treflyn-barn-theme .section-head,
body.treflyn-barn-theme .reveal-scale {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}

@media (prefers-reduced-motion: no-preference) {
  body.treflyn-barn-theme.js-reveal .reveal:not(.visible),
  body.treflyn-barn-theme.js-reveal .reveal-scale:not(.visible) {
    opacity: 0 !important;
    transform: translateY(18px) !important;
  }

  body.treflyn-barn-theme.js-reveal .reveal.visible,
  body.treflyn-barn-theme.js-reveal .reveal-scale.visible {
    opacity: 1 !important;
    transform: none !important;
  }
}