/* /get-a-quote/ — page-specific rules. Shared rules are in /assets/site.css.
   Values are production's inline sf-hero-css / sf-quote CSS and the former
   /get-a-quote/quote-v2.css (folded in here, Astra colour tokens replaced by
   the house tokens), plus the Astra `button` / `input` defaults that
   production's quote-v2 controls inherited. */

/* hero: the site's standard hero (geometry in site.css) */
.hero--get-a-quote { background-image: url("/wp-content/uploads/2026/09/get-a-quote-hero.jpg"); }
.hero--get-a-quote::before { opacity: .2; }

/* Astra's form-control resets and button defaults (0,0,1 specificity, so the
   .sf-qv2-* rules below override them exactly as they did on production). */
:where(.sf-quote-page) button {
  padding: 15px 25px;
  border: 1px solid var(--c-brown);
  border-radius: 0;
  background-color: transparent;
  color: var(--c-brown);
  font-family: inherit;
  font-weight: 700;
  font-size: 14px;
  line-height: 1em;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  cursor: pointer;
}
button:where(.sf-qv2-cal-nav, .sf-qv2-cal-day):hover,
button:where(.sf-qv2-cal-nav, .sf-qv2-cal-day):focus {
  color: var(--c-white);
  background-color: var(--c-brown);
  border-color: var(--c-brown);
}
/* Astra's `button:focus{outline:none}` and its input focus default: a thin
   dotted border on the estimator's fields (the enquiry form keeps its solid
   #9a9a9a border from site.css, as it did on production). */
button:where(.sf-qv2-cal-nav, .sf-qv2-cal-day):focus { outline: 0; }
#quote-enquiry button[type=submit]:focus { outline: 0; }
.sf-quote-builder input:focus { border-style: dotted; border-width: thin; }
.sf-quote-builder input { outline: none; }
.sf-quote-builder input:focus { border-color: inherit; }
.sf-quote-page input[type=radio]:checked,
.sf-quote-page input[type=checkbox]:checked { border-color: var(--c-sand); background-color: var(--c-sand); }

/* intro */
.sf-page-header { text-align: center; }
.sf-page-header h1 { font-family: var(--font-serif); font-weight: 400; font-size: 52px; margin-bottom: .3em; }
.sf-page-intro { max-width: 640px; margin: 0 auto 2em; text-align: center; color: var(--c-text); }
/* "View full package" buttons (2027, 2028 package PDFs) under the intro, aligned with it */
.quote-packages { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 0 0 2em; }

/* original quote builder (replaced at runtime by quote-v2.js; kept for the no-JS fallback) */
.sf-quote-builder { border: 1px solid var(--c-line); border-radius: 4px; padding: 1.5em; margin-bottom: 2.5em; background: #fff; }
/* once quote-v2.js has rendered its step cards, the outer card is a second border and inset around them */
.sf-quote-builder:has(> .sf-qv2-step) { border: 0; border-radius: 0; padding: 0; background: none; }
.sf-quote-guests { display: flex; align-items: center; gap: 12px; margin-bottom: 1.5em; flex-wrap: wrap; }
.sf-quote-guests label { font-size: 14px; }
.sf-quote-guests input { width: 100px; padding: 8px 10px; border: 1px solid #e2e2e2; border-radius: 3px; font: inherit; box-sizing: border-box; }
.sf-quote-loading { opacity: .7; font-style: italic; }
.sf-quote-category { margin-bottom: 1.75em; }
.sf-quote-category:last-child { margin-bottom: 0; }
.sf-quote-category h3 { font-family: 'Cormorant Garamond', serif; font-size: 26px; text-transform: none; margin: 0 0 .6em; border-bottom: 1px solid var(--c-line); padding-bottom: .3em; }
.sf-quote-item { display: flex; align-items: flex-start; gap: 12px; padding: .6em 0; cursor: pointer; border-bottom: 1px dashed rgba(0,0,0,.08); }
.sf-quote-item:last-child { border-bottom: none; }
.sf-quote-item input { margin-top: 4px; flex: 0 0 auto; }
.sf-quote-item-text { flex: 1 1 auto; display: flex; flex-direction: column; gap: 2px; }
.sf-quote-item-name { font-size: 15px; }
.sf-quote-item-desc { font-size: 13px; color: var(--c-text); opacity: .85; }
.sf-quote-item-price { flex: 0 0 auto; font-size: 14px; white-space: nowrap; padding-top: 1px; }
.sf-quote-total-bar { display: flex; justify-content: space-between; align-items: baseline; margin-top: 1.5em; padding-top: 1em; border-top: 2px solid var(--c-brown); }
.sf-quote-total-bar span { font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
.sf-quote-total-bar strong { font-family: 'Cormorant Garamond', serif; font-size: 32px; font-weight: 400; }
.sf-quote-disclaimer { margin-top: 1em; font-size: 12px; opacity: .7; }
.sf-quote-error { opacity: .75; font-style: italic; }
.sf-enquiry-wrap h2 { font-size: 32px; margin-bottom: .6em; }

/* Quote v2 — stepped wedding estimator (was /get-a-quote/quote-v2.css) */
.sf-qv2-step { border: 1px solid var(--c-line); border-radius: 4px; padding: 1.5em; margin-bottom: 1.5em; background: #fff; }
.sf-qv2-step-title { font-family: 'Cormorant Garamond', serif; font-size: 24px; font-weight: 400; margin: 0 0 .75em; text-transform: none; }

/* Calendar */
.sf-qv2-cal-wrap { max-width: 520px; margin: 0 auto; }
.sf-qv2-cal-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1em; }
.sf-qv2-cal-header h4 { font-family: 'Cormorant Garamond', serif; font-size: 22px; margin: 0; font-weight: 400; }
.sf-qv2-cal-nav { background: none; border: 1px solid var(--c-line); border-radius: 3px; width: 34px; height: 34px; font-size: 18px; line-height: 1; cursor: pointer; color: var(--c-brown); }
.sf-qv2-cal-nav:hover { background: #f2f2f2; }
.sf-qv2-cal-weekdays { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; margin-bottom: 6px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; text-align: center; opacity: .6; }
.sf-qv2-cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.sf-qv2-cal-day { aspect-ratio: 1/1; padding: 0; border: 1px solid transparent; border-radius: 3px; background: none; font: inherit; font-size: 14px; cursor: default; color: var(--c-text); }
.sf-qv2-cal-day-blank { visibility: hidden; }
.sf-qv2-cal-day-inert { opacity: .3; }
.sf-qv2-cal-day-booked { opacity: .35; text-decoration: line-through; }
.sf-qv2-cal-day-active { cursor: pointer; border-color: var(--c-sand); background: var(--c-cream); font-weight: 600; color: var(--c-brown); }
.sf-qv2-cal-day-active:hover { background: var(--c-sand); color: #fff; }
.sf-qv2-cal-day-selected { background: var(--c-sand); color: #fff; font-weight: 700; }
.sf-qv2-cal-legend { display: flex; gap: 1.25em; align-items: center; font-size: 12px; opacity: .75; margin: 1em 0 0; }
.sf-qv2-legend-swatch { display: inline-block; width: 12px; height: 12px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; }
.sf-qv2-legend-booked { background: #e2e2e2; text-decoration: none; }
.sf-qv2-legend-selected { background: var(--c-sand); }
.sf-qv2-selected-line { margin: 1em 0 0; font-size: 14px; font-weight: 600; }

/* Guests + package */
.sf-qv2-guests-row, .sf-qv2-nights-row { display: flex; align-items: center; gap: 12px; margin-bottom: 1em; flex-wrap: wrap; }
.sf-qv2-guests-row label, .sf-qv2-nights-row label { font-size: 14px; }
.sf-qv2-guests-row input, .sf-qv2-nights-row input { width: 100px; padding: 8px 10px; border: 1px solid #e2e2e2; border-radius: 3px; background: #fafafa; color: #666; font: inherit; box-sizing: border-box; }
/* the pre-wedding guests box shows a "Same as wedding" placeholder, which a 100px box cut off */
#qv2-pw-guests { width: 180px; }
.sf-qv2-package-line { font-size: 15px; margin: 0 0 .5em; }
.sf-qv2-warning { background: #f8eded; border: 1px solid #e0c2c2; border-radius: 3px; padding: 10px 12px; font-size: 13px; margin: 0.5em 0 0; }
.sf-qv2-note { font-size: 13px; opacity: .75; margin: .5em 0 1em; }

/* Pre-wedding / accommodation lists */
.sf-qv2-radio-list, .sf-qv2-check-list { display: flex; flex-direction: column; }
.sf-qv2-option { display: flex; align-items: flex-start; gap: 12px; padding: .6em 0; cursor: pointer; border-bottom: 1px dashed rgba(0,0,0,.08); }
.sf-qv2-option:last-child { border-bottom: none; }
.sf-qv2-option input { margin-top: 4px; flex: 0 0 auto; }
.sf-qv2-option-text { flex: 1 1 auto; display: flex; flex-direction: column; gap: 2px; }
.sf-qv2-option-name { font-size: 15px; }
.sf-qv2-option-desc { font-size: 13px; color: var(--c-text); opacity: .85; }
.sf-qv2-option-price { flex: 0 0 auto; font-size: 14px; white-space: nowrap; padding-top: 1px; }
/* Astra's input[type=number] rule outranked .sf-qv2-qty on production: its .75em padding, 2px radius and hairline border are what rendered. */
.sf-qv2-qty { flex: 0 0 auto; width: 64px; padding: .75em; border: 1px solid var(--c-line); border-radius: 2px; background: #fafafa; color: #666; font: inherit; box-sizing: border-box; text-align: center; }

/* Breakdown / total */
.sf-qv2-breakdown { display: flex; flex-direction: column; gap: .4em; margin-bottom: 1em; font-size: 15px; }
.sf-qv2-breakdown-row { display: flex; justify-content: space-between; gap: 1em; }
.sf-qv2-breakdown-row.sf-qv2-breakdown-note { font-size: 13px; opacity: .75; font-style: italic; }
.sf-qv2-total-bar { display: flex; justify-content: space-between; align-items: baseline; margin-top: 1em; padding-top: 1em; border-top: 2px solid var(--c-brown); }
.sf-qv2-total-bar span { font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
.sf-qv2-total-bar strong { font-family: 'Cormorant Garamond', serif; font-size: 32px; font-weight: 400; }
.sf-qv2-disclaimer { margin-top: 1em; font-size: 12px; opacity: .7; }

/* The page's original inline script hides #quote-builder when its own
   config fetch fails; quote-v2 owns this container now and always renders
   (with graceful degraded states), so defeat that inline display:none. */
#quote-builder { display: block !important; }

/* desktop: title, intro, the estimator steps and then the request form in the left column; "Your Estimate"
   in the right column, pinned in view while scrolling, so the running total is always beside the steps and
   the form. Once quote-v2.js has rendered its steps they join the page grid (display: contents). */
@media (min-width: 1025px) {
  .sf-quote-page > *, .sf-quote-page .sf-qv2-step { grid-column: 1; }
  .sf-quote-page .sf-page-header { text-align: left; }
  .sf-quote-page .sf-page-intro { max-width: none; margin: 0 0 2em; text-align: left; }
  .sf-quote-page .quote-packages { justify-content: flex-start; }
  /* !important because the #quote-builder { display: block !important } safeguard above would otherwise win */
  .sf-quote-page > #quote-builder:has(> .sf-qv2-step) { display: contents !important; }
  .sf-quote-page #qv2-step-summary { grid-column: 2; grid-row: 1 / span 12; align-self: start; position: sticky; top: 24px; }
}

/* Phones: the calendar arrows drop the inherited 25px side padding so the month header
   fits at 320px, and option rows stack: quantity or tick box beside the description,
   price on its own line underneath instead of squeezing the description to one word a line. */
@media (max-width: 544px) {
  .sf-qv2-cal-nav { padding: 0; }
  .sf-qv2-option, .sf-quote-item { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 12px; row-gap: 4px; }
  .sf-qv2-option-price, .sf-quote-item-price { grid-column: 2; }
}