/* =====================================================
   BOOK TOUR PAGE — GLOBAL
===================================================== */

.book-tour{
  background:#f7f1e6;
}

.book-main,
.book-main *{
  opacity:1;
  color:#1f1b15;
}

.book-summary{
  grid-column:2;
  align-self:start;
  position:sticky;
  top:180px;
  max-width:420px;
}

#site-content,
.book-content,
.book-grid,
.site-container{
  overflow:visible !important;
}

/* =====================================================
   SLIM HERO (MATCHES TOUR HERO)
===================================================== */

.hero-booking-slim{
  position:relative;
  text-align:center;
  padding:120px 20px 80px;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.75), rgba(0,0,0,.9)),
    url('/wp-content/themes/raleigh-haunts-theme/assets/raleigh-night.png')
    center/cover no-repeat;
  color:#fff;
}

.hero-booking-slim .hero-title{
  font-family:'Cormorant Garamond', serif;
  font-size:clamp(44px,5vw,70px);
}

.hero-booking-slim .hero-eyebrow{
  font-family:'Cinzel', serif;
  letter-spacing:.25em;
  text-transform:uppercase;
  color:#c9a66b;
  font-size:13px;
}

/* =====================================================
   MAIN BOOKING CONTENT
===================================================== */

.book-content{
  background:#f7f1e6;
  padding:80px 0 100px;
}

.book-grid{
  display:grid;
  grid-template-columns: minmax(0,1fr) 420px;
  column-gap:64px;
  align-items:start;
  max-width:1200px;
  margin:40px auto 0;
}

.book-main{
  max-width:none;
  width:100%;
}

@media (max-width:980px){
  .book-grid{
    grid-template-columns:1fr;
  }
}

/* =====================================================
   LEFT COLUMN
===================================================== */

.book-main h2{
  font-family:'Cinzel', serif;
  letter-spacing:.18em;
  font-size:13px;
  text-transform:uppercase;
  color:#7a5a2b;
  margin:32px 0 18px;
}

/* =====================================================
   DATE / TIME
===================================================== */

.rh-dates,
.rh-times{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  overflow:visible;
}

.rh-time{
  flex:0 0 auto;
  width:auto;
  min-width:150px;
  text-align:center;
}


.rh-date,
.rh-time{
  background:#ffffff;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.08);
  padding:14px 18px;
  font-weight:600;
  cursor:pointer;
  transition:.15s ease;
  box-shadow:0 8px 18px rgba(0,0,0,.05);
}

.rh-date.active,
.rh-time.active{
  background:#e63946;
  color:#fff;
  border-color:#e63946;
}

/* =====================================================
   TICKETS + ADDONS  ✅ (FIXED — THIS WAS BROKEN)
===================================================== */

.rh-ticket-ui,
.rh-upsell-ui,
.rh-merch-ui{
  margin-top:28px;
  background:#ffffff;
  border-radius:22px;
  padding:28px;
  box-shadow:0 20px 40px rgba(0,0,0,.06);
}

.rh-upsell-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:16px 0;
  border-bottom:1px solid rgba(0,0,0,.08);
}

.rh-upsell-row:last-child{
  border-bottom:none;
}

/* qty controls */
.rh-qty button{
  background:#f2efe9;
  border:1px solid rgba(0,0,0,.12);
  padding:6px 12px;
  border-radius:8px;
  cursor:pointer;
}

/* =====================================================
   MERCH GRID
===================================================== */

.rh-merch-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:20px;
}

.rh-merch-card{
  background:#f8f8f8;
  border-radius:18px;
  padding:16px;
  text-align:center;
  box-shadow:0 14px 28px rgba(0,0,0,.06);
}

.rh-merch-card img{
  width:100%;
  border-radius:14px;
  margin-bottom:10px;
}

/* headings inside cards (gold) */
.rh-merch-ui h2,
.rh-upsell-ui h2,
.rh-ticket-ui h2{
  font-family:'Cinzel', serif;
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7a5a2b;
}

.rh-merch-ui + .rh-merch-ui{
  margin-top:0;
}

/* =====================================================
   SUMMARY CARD
===================================================== */

.book-summary{
  grid-column:2;
  position:sticky;
  top:160px;
  width:420px;
  align-self:start;
  background:#ffffff;
  border-radius:22px;
  padding:32px;
  box-shadow:0 20px 40px rgba(0,0,0,.08);
}

/* original summary font (kept), later we override to match gold card title */
.book-summary h3{
  font-family:'Cormorant Garamond', serif;
  font-size:28px;
  margin-bottom:18px;
}

.summary-list{
  list-style:none;
  padding:0;
  margin:0;
}

.summary-list li{
  display:flex;
  justify-content:space-between;
  padding:12px 0;
  border-bottom:none;
  color:#333;
}

.summary-divider{
  margin:16px 0 8px;
  border-top:1px solid rgba(0,0,0,.12);
}

.book-content,
.book-tour,
#site-content{
  overflow:visible !important;
}

/* =====================================================
   CHECKOUT BUTTON
===================================================== */

.rh-pay-btn{
  width:100%;
  margin-top:22px;
  background:#e63946;
  color:#fff;
  border-radius:999px;
  padding:18px 28px;
  font-family:'Cinzel', serif;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-weight:700;
  box-shadow:0 12px 30px rgba(230,57,70,.35);
}

.rh-pay-btn:hover{
  background:#cf2f3c;
}

/* remove theme button border (black frame) */
.rh-pay-btn{
  border:none !important;
  outline:none !important;
}

/* =====================================================
   MERCH MODAL
===================================================== */

.rh-merch-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
}

.rh-merch-modal-inner{
  background:#ffffff;
  border-radius:22px;
  padding:36px;
  width:420px;
  max-width:92%;
  box-shadow:0 24px 60px rgba(0,0,0,.35);
}

/* default hidden */
.rh-merch-modal{
  opacity:0;
  pointer-events:none;
  transition:.2s ease;
}

/* visible state */
.rh-merch-modal.is-open{
  opacity:1;
  pointer-events:auto;
}

/* better inner layout */
.rh-merch-modal-inner{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.rh-merch-modal-inner select{
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.15);
}

.rh-merch-modal-inner button{
  margin-top:8px;
}


/* =====================================================
   CONTAINER
===================================================== */

.site-container{
  max-width:1180px;
  margin:0 auto;
  padding:0 24px;
}

/* =====================================================
   VERTICAL SPACING
===================================================== */

.section-pad-lg{ padding:90px 0; }
.section-pad-md{ padding:60px 0; }
.section-pad-sm{ padding:36px 0; }

/* =====================================================
   HERO-CONTENT TRANSITION
===================================================== */

.hero-booking-slim{
  margin-bottom:-60px;
  z-index:2;
}

.book-content{
  position:relative;
  z-index:3;
  border-top-left-radius:40px;
  border-top-right-radius:40px;
  margin-top:-40px;
}

/* =====================================================
   SECTION HEADER (spacing)
===================================================== */

.book-main h2{
  margin-top:52px;
  margin-bottom:18px;
}

.book-main h2:first-child{
  margin-top:10px;
}

/* =====================================================
   CARD SPACING
===================================================== */

.rh-ticket-ui,
.rh-upsell-ui,
.rh-merch-ui{
  margin-top:26px;
}

.rh-ticket-ui:first-of-type{
  margin-top:12px;
}

/* =====================================================
   STICKY SUMMARY
===================================================== */

.book-summary{
  top:180px;
}

/* =====================================================
   SUMMARY TITLE + DISCLAIMER COLOR FIX
===================================================== */

.book-summary h3{
  color:#1f1b15;
}

.book-summary small,
.book-summary .summary-note{
  color:#8b7a63;
  opacity:1;
}

/* =====================================================
   WOO MERCH BUTTON STYLE FIX
===================================================== */

.rh-merch-card .button,
.rh-merch-card button{
  background:#e63946 !important;
  color:#fff !important;
  border:none !important;
  border-radius:999px !important;
  padding:10px 18px !important;
  font-family:'Cinzel', serif !important;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:12px;
}

.rh-merch-card .price{
  color:#1f1b15 !important;
  font-weight:600;
}

/* =====================================================
   FORCE FONT VISIBILITY INSIDE BOOKING
===================================================== */

.book-main,
.book-main *{
  opacity:1 !important;
}

/* =====================================================
   CALENDAR GRID
===================================================== */

.rh-calendar{
  background:#fff;
  border-radius:22px;
  padding:28px;
  box-shadow:0 20px 40px rgba(0,0,0,.06);
  margin-bottom:24px;
}

.rh-cal-header{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin-bottom:20px;
}

.rh-cal-header button{
  background:#f2efe9;
  border:1px solid rgba(0,0,0,.12);
  border-radius:10px;
  padding:6px 12px;
  cursor:pointer;
}

.rh-cal-grid{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:10px;
}

.rh-cal-day{
  background:#ffffff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  padding:14px 0;
  text-align:center;
  font-weight:600;
  cursor:pointer;
  transition:.15s ease;
}

.rh-cal-day.available:hover{
  border-color:#e63946;
}

.rh-cal-day.active{
  background:#e63946;
  color:#fff;
  border-color:#e63946;
}

.rh-cal-day.disabled{
  opacity:.25;
  cursor:not-allowed;
}

.rh-datetime-card .rh-times{
  margin-top:20px;
}


/* =====================================================
   DATE + TIME SINGLE CARD (correct selectors)
===================================================== */

.rh-datetime-card{
  background:#ffffff;
  border-radius:22px;
  padding:28px;
  box-shadow:0 20px 40px rgba(0,0,0,.06);
  margin-top:12px; /* keeps it tight at top */
}

/* Gold title INSIDE the card (matches Tickets card style) */
.rh-card-title{
  font-family:'Cinzel', serif;
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7a5a2b;
  margin:0 0 18px;
}

/* hide the old subheadings but keep for accessibility */
.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* spacing between date row and time row inside same card */
#rh-booking-ui .rh-times{
  margin-top:24px;
}

/* IMPORTANT: stop the page-level "Select Date & Time" header from showing */
.book-main > h2{
  display:none;
}


.rh-time{
  width:auto;
  flex:0 0 auto;   /* prevents stretching */
  min-width:140px;
  text-align:center;
}

#rh-booking-ui{
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
}


/* =====================================================
   SUMMARY TITLE — match gold card titles (override)
===================================================== */

.book-summary h3{
  font-family:'Cinzel', serif;
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7a5a2b;
  margin:0 0 18px;
}

/* =====================================================
   FIX COLUMN START ALIGNMENT
===================================================== */

.book-grid{
  align-items:start; /* force both columns to start same height */
}

.book-main{
  padding-top:0;
  margin-top:0;
}

/* =====================================================
   PREVENT LEFT COLUMN FROM LOOKING LIKE ONE BIG CARD
===================================================== */

/* ensure only actual cards have white background */
.book-main{
  background:transparent !important;
  box-shadow:none !important;
}

/* spacing between stacked cards */
.rh-datetime-card + .rh-ticket-ui,
.rh-ticket-ui + .rh-upsell-ui,
.rh-upsell-ui + .rh-merch-ui{
  margin-top:26px;
}


/* =====================================================
   REMOVE HERO OVERLAP OFFSET DIFFERENCE
===================================================== */

.book-content{
  margin-top:0;        /* remove negative stacking offset */
  border-radius:40px 40px 0 0;
}

/* =====================================================
   ENSURE SUMMARY CARD STARTS SAME LEVEL
===================================================== */

.book-summary{
  margin-top:12px;   /* matches first card visual offset */
}


/* =====================================================
   BOOK PAGE HEADER (replaces hero)
===================================================== */

.book-content--no-hero{
  padding:40px 0 100px; /* less top padding since hero is gone */
  margin-top:0;
  position:relative;
  z-index:3;
  border-top-left-radius:40px;
  border-top-right-radius:40px;
}

.book-pagehead{
  margin:0 0 18px;
}

.book-pagehead-eyebrow{
  font-family:'Cinzel', serif;
  letter-spacing:.25em;
  text-transform:uppercase;
  color:#7a5a2b;
  font-size:12px;
  margin-bottom:8px;
}

.book-pagehead-title{
  font-family:'Cormorant Garamond', serif;
  font-size:clamp(26px, 2.4vw, 40px);
  margin:0;
  color:#1f1b15;
}

/* Ensure both columns start at same height */
.book-grid{
  align-items:start;
}

/* Sticky summary: adjust top because hero is gone */
.book-summary{
  top:40px; /* was ~180px for hero */
}

/* If your theme header is still tall, this keeps summary from hiding under it */
@media (max-width:980px){
  .book-summary{
    position:relative;
    top:auto;
    width:auto;
    margin-top:18px;
  }
}

/* =====================================================
   BOOK TOUR: FORCE COMPACT HEADER + VISIBLE NAV
   (doesn't depend on your header class names)
===================================================== */

/* 1) shrink ANY header that appears before/above #site-content on booking page */
body:has(#site-content.book-tour) header{
  height:auto !important;
  min-height:0 !important;
  padding-top:10px !important;
  padding-bottom:10px !important;
}

/* 2) prevent "reserved hero header height" from pushing content down */
body:has(#site-content.book-tour){
  --header-h: 90px;
  --header-h-scrolled: 90px;
}

/* 3) if your theme uses a fixed height wrapper, neutralize it */
body:has(#site-content.book-tour) .site-header,
body:has(#site-content.book-tour) .header,
body:has(#site-content.book-tour) #masthead{
  height:90px !important;
  min-height:90px !important;
}

/* 4) shrink logo images inside header */
body:has(#site-content.book-tour) header img{
  max-height:60px !important;
  width:auto !important;
}

/* 5) ensure nav links are readable/visible (your screenshot shows they’re washed out) */
body:has(#site-content.book-tour) header a{
  opacity:1 !important;
  filter:none !important;
}

/* 6) sticky immediately */
body:has(#site-content.book-tour) .site-header,
body:has(#site-content.book-tour) .header,
body:has(#site-content.book-tour) #masthead{
  position:sticky !important;
  top:0 !important;
  z-index:9999 !important;
}


/* =====================================================
   SUMMARY 
===================================================== */
.summary-line{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
}

.summary-left strong{
  display:block;
}

.summary-variant{
  display:block;
  font-size:12px;
  opacity:.7;
  margin-top:2px;
}

.summary-right{
  font-weight:600;
  min-width:80px;
  text-align:right;
}

/* ALL summary rows share same layout */
.summary-list li{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
}

/* left column */
.summary-line,
.summary-list li > div.summary-left{
  flex:1;
}

/* price column (global alignment) */
.summary-list li > span,
.summary-right{
  min-width:90px;
  text-align:right;
  font-weight:400; /* remove bold */
}

/* =====================================================
   MERCH CARD SPACING FIX
===================================================== */

.rh-merch-card{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.rh-merch-card .rh-merch-title{
  margin-top:6px;
  font-weight:600;
}

.rh-merch-card button{
  margin-top:auto;
}


/* =====================================================
   MERCH MODAL BRAND STYLING
===================================================== */

.rh-merch-modal-inner h3{
  font-family:'Cormorant Garamond', serif;
  font-size:26px;
  margin-bottom:10px;
  color:#1f1b15;
}

.rh-merch-price{
  font-size:18px;
  font-weight:600;
  color:#7a5a2b;
  margin-bottom:10px;
}

.rh-merch-modal-inner label{
  font-family:'Cinzel', serif;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:12px;
  color:#7a5a2b;
}

.rh-merch-modal-inner select{
  background:#f7f1e6;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.15);
  padding:12px 14px;
}

.rh-merch-modal-inner .rh-add-merch{
  background:#e63946;
  color:#fff;
  border:none;
  border-radius:999px;
  padding:14px 20px;
  font-family:'Cinzel', serif;
  letter-spacing:.14em;
}

.rh-merch-modal-inner .rh-close{
  background:#f2efe9;
  border-radius:999px;
  padding:12px 20px;
}


/* =====================================================
   TIP DESCRIPTION + INPUT STYLE
===================================================== */

.rh-tip-input{
  width:120px;
  text-align:right;
  border-radius:10px;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,.18);
  background:#f7f1e6;
}

.rh-upsell-row.is-soft small{
  display:block;
  margin-top:4px;
  opacity:.65;
}


/* =====================================================
   QTY CONTROLS — MATCH TICKETS STYLE
===================================================== */

.rh-qty{
  display:flex;
  align-items:center;
  gap:8px;
}

.rh-qty button{
  width:36px;
  height:36px;
  border-radius:10px;
  background:#f2efe9;
  border:1px solid rgba(0,0,0,.14);
  font-size:18px;
  line-height:1;
}

/* =====================================================
   SUMMARY MERCH QTY CONTROLS
===================================================== */

.summary-qty{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:6px;
}

.summary-qty button{
  width:34px;
  height:34px;
  border-radius:10px;
  background:#f2efe9;
  border:1px solid rgba(0,0,0,.14);
  font-size:16px;
  line-height:1;
  cursor:pointer;
}

.summary-qty span{
  min-width:22px;
  text-align:center;
  font-weight:500;
}

.summary-variant{
  margin-bottom:6px;
}



/* =====================================================
   MOBILE
===================================================== */

@media (max-width:700px){

  .rh-merch-grid{
    grid-template-columns:1fr;
  }

  .rh-upsell-row{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }

  .rh-qty{
    align-self:flex-end;
  }

  .book-summary{
    position:relative;
    top:auto;
    width:auto;
  }

}


/* =====================================================
   MOBILE BOOKING LAYOUT (FINAL PATCH)
===================================================== */

@media (max-width:900px){

  /* collapse two-column layout */
  .book-grid{
    grid-template-columns:1fr;
    row-gap:28px;
  }

  /* summary moves below content */
  .book-summary{
    grid-column:auto;
    position:relative;
    top:auto;
    width:auto;
    max-width:100%;
    margin-top:10px;
  }

  /* cards spacing */
  .rh-ticket-ui,
  .rh-upsell-ui,
  .rh-merch-ui{
    padding:22px;
  }

  /* merch grid single column */
  .rh-merch-grid{
    grid-template-columns:1fr;
    gap:18px;
  }

  /* qty rows stack cleanly */
  .rh-upsell-row{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }

  .rh-qty{
    align-self:flex-end;
  }

  /* summary merch qty stays inline */
  .summary-qty{
    justify-content:flex-start;
  }

  /* modal full width */
  .rh-merch-modal-inner{
    width:92%;
    padding:26px;
  }

}

/* =====================================================
   SMALL PHONE
===================================================== */

@media (max-width:480px){

  .rh-date,
  .rh-time{
    min-width:120px;
    padding:12px 14px;
  }

  .rh-pay-btn{
    padding:16px 18px;
    font-size:13px;
  }

  .rh-merch-modal-inner h3{
    font-size:22px;
  }

}

/* =====================================================
   CHECKOUT PAGE — GLOBAL
===================================================== */

.checkout-page{
  background:#f7f1e6;
  padding:60px 0 100px;
}

.checkout-container{
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
}

.checkout-page h1,
.checkout-page h2,
.checkout-page h3{
  font-family:'Cormorant Garamond', serif;
  color:#1f1b15;
}

.checkout-page label{
  font-family:'Cinzel', serif;
  letter-spacing:.12em;
  font-size:12px;
  text-transform:uppercase;
  color:#7a5a2b;
}

.checkout-page .site-sidebar,
.checkout-page .widget-area{
  display:none !important;
}

.checkout-page .woocommerce{
  max-width:100%;
}

/* =====================================================
   CHECKOUT GRID LAYOUT
===================================================== */

.checkout-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 420px;
  column-gap:64px;
  align-items:start;
}

.checkout-left{
  min-width:0;
}

.checkout-right{
  position:sticky;
  top:120px;
  align-self:start;
  background:#ffffff;
  border-radius:22px;
  padding:28px;
  box-shadow:0 20px 40px rgba(0,0,0,.08);
}

.checkout-title{
  font-family:'Cinzel', serif;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:13px;
  color:#7a5a2b;
  margin-bottom:18px;
}

/* MOBILE */
@media (max-width:980px){
  .checkout-grid{
    grid-template-columns:1fr;
    row-gap:28px;
  }

  .checkout-right{
    position:relative;
    top:auto;
  }
}

/* ==========================================
   REAL CHECKOUT GRID CONTROL
========================================== */

/* Make Woo checkout wrapper the grid */
.checkout-page .woocommerce-checkout{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 420px !important;
  column-gap:64px;
  align-items:start;
}

/* Left column (billing + shipping) */
.checkout-page #customer_details{
  grid-column:1 !important;
  width:100% !important;
}

/* Right column (order review) */
.checkout-page #order_review{
  grid-column:2 !important;
}

/* disable Woo float columns */
.checkout-page .col2-set,
.checkout-page .col2-set .col-1,
.checkout-page .col2-set .col-2{
  float:none !important;
  width:100% !important;
}


/* ==========================================
   CHECKOUT PRICES — FINAL
========================================== */

.checkout-page .woocommerce-checkout-review-order-table{
    width:100% !important;
    table-layout:auto !important;
}

.checkout-page .woocommerce-checkout-review-order-table colgroup col:last-child{
    width:140px !important;
}

.checkout-page .woocommerce-checkout-review-order-table th.product-total,
.checkout-page .woocommerce-checkout-review-order-table td.product-total{
    text-align:right !important;
    white-space:nowrap !important;
    font-weight:600;
}


/* ==========================================
   CHECKOUT CARD STYLE (match booking cards)
========================================== */

.checkout-page #customer_details,
.checkout-page #payment{
  background:#ffffff;
  border-radius:22px;
  padding:28px;
  box-shadow:0 20px 40px rgba(0,0,0,.06);
  margin-bottom:24px;
}

.checkout-page #order_review{
  background:#ffffff;
  border-radius:22px;
  padding:28px;
  box-shadow:0 20px 40px rgba(0,0,0,.08);
}

.checkout-page form.checkout{
  row-gap:26px;
}