/* contact/enq-quoteform.css - R-Q46 (Paul 10/10/26, rulings Q46 + Q50): the quote forms the contact wizard hands off to
   (Templates/BespokeProductRequest.cfm, BespokeQuoteRequest.cfm, DisplayQuotes0.cfm via QuoteRequest.cfm).
   Scoped to #inner-text and the enq-qf form so nothing else on those pages, or on any other page, changes.
   Type follows the contact wizard: body and labels 16px, fields 17px, group headings 22px, button 18px. */

/* (a) the intro's first h2 repeats the page title (the orange banner h1). W3F-A-FO3: the template adds enq-qf-dup only when it does
   (most of the product-name words appear in that h2); other intros keep their heading. */
#inner-text .enq-qf-intro.enq-qf-dup > h2:first-child { display: none; }
#inner-text .enq-qf-intro,
#inner-text .enq-qf-intro p,
#inner-text .enq-qf-intro li,
#inner-text .enq-qf-intro b { font-size: 16px; line-height: 1.5; color: #262d31; }
#inner-text .enq-qf-intro ol { margin: 4px 0 12px 22px; padding: 0; }

/* (b) help links: tidy row, inline icons */
#inner-text .enq-qf-help { display: flex; flex-wrap: wrap; gap: 4px 24px; margin: 8px 0 4px; }
#inner-text .enq-qf-help a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 16px; line-height: 1.3;
  color: #262d31 !important; text-decoration: underline; text-transform: none; letter-spacing: normal; }
#inner-text .enq-qf-help svg { width: 22px; height: 22px; flex: 0 0 auto; color: #f7941e; }
#inner-text .enq-qf-help a:focus-visible { outline: 3px solid #262d31; outline-offset: 2px; }

/* (c) readable text (field labels only: DisplayQuotes0's item table uses <label> for its column headers) */
#inner-text p.enq-qf-lead { margin: 12px 0 8px; font-size: 16px; line-height: 1.5; color: #262d31; }
#inner-text form.enq-qf { font-size: 16px; color: #262d31; }
#inner-text form.enq-qf p,
#inner-text form.enq-qf li { font-size: 16px; line-height: 1.5; }
#inner-text form.enq-qf fieldset { border: 0; padding: 0; margin: 0 0 18px; max-width: 640px; }
#inner-text form.enq-qf fieldset label { display: block; float: none; width: auto !important; margin: 0 0 6px; font-size: 16px; line-height: 1.4; font-weight: bold; color: #262d31; text-transform: none; }
#inner-text form.enq-qf fieldset label i { font-weight: normal; color: #4a5359; }
#inner-text form.enq-qf input[type="text"],
#inner-text form.enq-qf input[type="email"],
#inner-text form.enq-qf select,
#inner-text form.enq-qf textarea { box-sizing: border-box; width: 100% !important; max-width: 640px; min-height: 48px; height: auto !important;
  padding: 10px 12px; font-size: 17px; line-height: 1.4; color: #262d31; background: #fff; border: 1.5px solid #c9c9c9 !important; border-radius: 8px; }
#inner-text form.enq-qf textarea { min-height: 140px; }
#inner-text form.enq-qf input[type="text"]:focus,
#inner-text form.enq-qf input[type="email"]:focus,
#inner-text form.enq-qf select:focus,
#inner-text form.enq-qf textarea:focus { outline: none; border-color: #262d31 !important; box-shadow: 0 0 0 3px rgba(247, 148, 30, 0.35); }

/* (d) groups: Your item / Your details / Photos */
#inner-text form.enq-qf h2.enq-qf-group { clear: both; margin: 28px 0 14px; padding: 0 0 8px; font-size: 22px; line-height: 1.25; font-weight: bold;
  color: #262d31; text-transform: none; border-bottom: 1px solid #ececec; background: none; }

/* (f) one sentence with a tick */
#inner-text form.enq-qf .enq-qf-check { max-width: 640px; margin: 24px 0 8px !important; padding: 0; border: 0; background: none; box-shadow: none; }
#inner-text form.enq-qf label.enq-qf-tick { display: flex; align-items: flex-start; gap: 12px; margin: 0; font-weight: normal; cursor: pointer; }
#inner-text form.enq-qf label.enq-qf-tick input { flex: 0 0 auto; width: 24px; height: 24px; margin: 1px 0 0; accent-color: #f7941e; cursor: pointer; }
#inner-text form.enq-qf label.enq-qf-tick b,
#inner-text form.enq-qf label.enq-qf-tick span { font-size: 16px; line-height: 1.5; color: #262d31 !important; text-transform: none; }
#inner-text form.enq-qf label.enq-qf-tick input:focus-visible { outline: 3px solid #262d31; outline-offset: 2px; }

/* (e) the send button in the wizard's style (on the bespoke templates the existing markup leaves it outside the form and #inner-text, inside #rightcol; it still submits via its form owner, so it is not scoped to the form) */
#inner-text input.enq-qf-go, #rightcol input.enq-qf-go { display: block; float: none !important; box-sizing: border-box; width: 100%; max-width: 480px !important; min-height: 56px; height: auto;
  margin: 16px 0 24px; padding: 14px 20px; font-family: inherit; font-size: 18px !important; font-weight: bold; line-height: 1.35; letter-spacing: normal; text-transform: none;
  color: #262d31 !important; background: #f7941e !important; border: 0 !important; border-radius: 10px; box-shadow: none; text-shadow: none; cursor: pointer; }
@media (hover: hover) { #inner-text input.enq-qf-go:hover, #rightcol input.enq-qf-go:hover { background: #ffa53d !important; } }
#inner-text input.enq-qf-go:focus-visible, #rightcol input.enq-qf-go:focus-visible { outline: 3px solid #262d31; outline-offset: 2px; }

@media (max-width: 640px) {
  /* W3F-B-F4/B-F8: DisplayQuotes0's upload column is half width on desktop; on phones it takes the row, so the drop zone is usable */
  #inner-text form.enq-qf .enq-qf-uploads { width: 100% !important; float: none !important; }
  #inner-text form.enq-qf .enq-qf-uploads-wrap { margin-bottom: 8px !important; }
  #inner-text form.enq-qf .enq-up { min-width: 0; max-width: none; }
  #inner-text form.enq-qf h2.enq-qf-group { font-size: 20px; }
  #inner-text input.enq-qf-go, #rightcol input.enq-qf-go { max-width: none !important; }
}
/* W4 (Paul 12/10/26): "parts do not do full width (plus still need to be mobile optimised)".
   Bespoke templates only (form and button carry enq-qf-wide); DisplayQuotes0 shares this file and the Made2Match id, so it is not touched.
   The form uses the page's content column instead of a 640px strip; the send button spans it too. */
#inner-text form.enq-qf-wide fieldset,
#inner-text form.enq-qf-wide input[type="text"],
#inner-text form.enq-qf-wide input[type="email"],
#inner-text form.enq-qf-wide select,
#inner-text form.enq-qf-wide textarea,
#inner-text form.enq-qf-wide .enq-qf-check,
#inner-text form.enq-qf-wide .enq-up { max-width: none; }
#inner-text input.enq-qf-go.enq-qf-wide, #rightcol input.enq-qf-go.enq-qf-wide { max-width: none !important; }
/* 12a gap above the tick: the old spacer paragraph (padding-top 40px / 85px) before the checklist */
#inner-text form.enq-qf-wide div.clearfix + p[style*="padding-top"] { display: none; }
/* "Consider alternative material": the whole line is the tap target, at least 44px high, with a 24px box like the tick */
#inner-text form.enq-qf-wide label.enq-qf-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; min-height: 44px; margin: 0;
  font-weight: normal; cursor: pointer; }
/* style.css colours every span in a Made2Match label red (for the asterisks); keep this one its own orange */
#inner-text form.enq-qf-wide label.enq-qf-alt span.orangetext { color: #f47a22; }
#inner-text form.enq-qf-wide label.enq-qf-alt input { flex: 0 0 auto; width: 24px; height: 24px; margin: 0; accent-color: #f7941e; cursor: pointer; }
#inner-text form.enq-qf-wide label.enq-qf-alt input:focus-visible { outline: 3px solid #262d31; outline-offset: 2px; }
