/*
 * Contact Form 7, site-wide (spec 6.9 #3): product pages, the quote page and the
 * contact page. Selectors carry `.wpcf7 .wpcf7-form` to outrank the parent theme's
 * `.ts-form-wrap …` rules (uppercase Open Sans fields, navy button).
 */
.wpcf7 .wpcf7-form {
  font-family: var(--gs-font);
  color: var(--gs-body);
  text-align: start;
}
.wpcf7 .wpcf7-form p { margin: 0; }
.wpcf7 .wpcf7-form p > br { display: none; }

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap { display: block; margin-bottom: 12px; }

/* :where() keeps this at (0,3,1) so the select, textarea and invalid rules below can refine it. */
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap :is(input, select, textarea):not(:where([type="checkbox"], [type="radio"])) {
  display: block;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 11px 14px;
  border: 1px solid #7D93A1;
  border-radius: var(--gs-radius);
  background: var(--gs-white);
  box-shadow: none;
  color: var(--gs-navy);
  font: 400 1rem/1.4 var(--gs-font-info);
  letter-spacing: normal;
  text-transform: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap :is(input, textarea)::placeholder {
  color: var(--gs-muted);
  opacity: 1;
  text-transform: none;
}
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap :is(input, select, textarea):focus {
  outline: none;
  border-color: var(--gs-navy);
  box-shadow: 0 0 0 2px var(--gs-navy);
}
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap select {
  padding-right: 42px;
  appearance: none;
  background: var(--gs-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23083E5F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 18px;
  cursor: pointer;
}
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap textarea { min-height: 96px; resize: vertical; }

/* The parent theme hangs icon-font glyphs on the wrappers. */
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap::before,
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap::after { content: none; }

.wpcf7 .wpcf7-form .wpcf7-form-control-wrap .wpcf7-form-control.wpcf7-not-valid { border-color: #B42318; }
.wpcf7 .wpcf7-form .wpcf7-not-valid-tip { margin-top: 4px; color: #B42318; font-size: var(--gs-fs-sm); font-weight: 600; }

/* Consent checkbox. */
.wpcf7 .wpcf7-form .wpcf7-acceptance .wpcf7-list-item { display: block; margin: 0; }
.wpcf7 .wpcf7-form .wpcf7-acceptance label { display: flex; align-items: flex-start; gap: 10px; color: var(--gs-body); font-size: var(--gs-fs-sm); line-height: 1.45; cursor: pointer; }
.wpcf7 .wpcf7-form .wpcf7-acceptance input { flex: none; width: 20px; height: 20px; margin: 0; accent-color: var(--gs-navy); }
/* The old forms colour this link inline with #FA7806 (2.9:1 on white). */
.wpcf7 .wpcf7-form .wpcf7-acceptance a { color: var(--gs-navy) !important; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }

/* Submit. */
.wpcf7 .wpcf7-form p:has(> .wpcf7-submit) { position: relative; }
.wpcf7 .wpcf7-form .wpcf7-submit {
  display: block;
  width: 100%;
  height: auto;
  min-height: 52px;
  margin: 4px 0 14px;
  padding: 12px 20px;
  border: 0;
  border-radius: var(--gs-radius);
  background: var(--gs-accent);
  box-shadow: none;
  color: var(--gs-white);
  font: 600 0.9375rem/1.2 var(--gs-font-button);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color 0.15s;
}
.wpcf7 .wpcf7-form .wpcf7-submit:hover { background: #E56D00; }
.wpcf7 .wpcf7-form .wpcf7-submit:focus-visible { outline: none; box-shadow: var(--gs-focus); }
.wpcf7 .wpcf7-form .wpcf7-submit:disabled { opacity: 0.7; cursor: not-allowed; }
.wpcf7 .wpcf7-form .wpcf7-spinner { position: absolute; right: 14px; bottom: 28px; margin: 0; }
/* The new form asks for consent before the button; the old ones after it, so the button
   looked disabled for no visible reason. Their consent moves above the button (CSS order,
   the forms themselves unchanged; UI/UX round). */
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap:has(.wpcf7-acceptance) { margin-bottom: 16px; }
.wpcf7 .wpcf7-form p:has(> .wpcf7-submit) { display: flex; flex-direction: column; }
.wpcf7 .wpcf7-form .wpcf7-submit ~ .wpcf7-form-control-wrap:has(.wpcf7-acceptance) { order: -1; margin-bottom: 14px; }

/* Checkbox groups (the Pet form's eleven illnesses): 44 px rows, two per line (WCAG 2.5.8). */
.wpcf7 .wpcf7-form .wpcf7-checkbox { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.wpcf7 .wpcf7-form .wpcf7-checkbox .wpcf7-list-item { display: block; width: 100%; min-width: 0; margin: 0; }
.wpcf7 .wpcf7-form .wpcf7-checkbox label { display: flex; align-items: center; gap: 8px; width: 100%; height: 100%; min-height: 44px; padding: 6px 10px; border: 1px solid var(--gs-line); border-radius: var(--gs-radius); color: var(--gs-body); font: 400 0.8125rem/1.3 var(--gs-font-info); cursor: pointer; }
/* The client's Additional CSS sets `span.wpcf7-list-item label { width: auto !important }`. */
.wpcf7 .wpcf7-form .wpcf7-checkbox .wpcf7-list-item label { width: 100% !important; }
.wpcf7 .wpcf7-form .wpcf7-checkbox input { flex: none; width: 18px; height: 18px; margin: 0; accent-color: var(--gs-navy); }
.wpcf7 .wpcf7-form .wpcf7-checkbox label:has(:checked) { border-color: var(--gs-navy); background: var(--gs-mist); }

/* Long product forms (10+ fields, .gs-quote--long): two columns of fields on a wide card;
   long-question selects (.gs-field-wide), text areas and checkbox groups keep the full
   width, and the checkbox group takes three columns. */
@media (min-width: 600px) {
  .gs-quote--long .wpcf7-form > p:first-of-type { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; }
  .gs-quote--long .wpcf7-form > p:first-of-type > .wpcf7-form-control-wrap:is(.gs-field-wide, :has(textarea, .wpcf7-checkbox)) { grid-column: 1 / -1; }
  .gs-quote--long .wpcf7-form .wpcf7-checkbox { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gs-quote--long .wpcf7-form .wpcf7-checkbox label { min-height: 40px; padding: 4px 8px; font-size: 0.75rem; }
}

/* Result line. */
.wpcf7 .wpcf7-form .wpcf7-response-output { margin: 12px 0 0; padding: 12px 14px; border: 0; border-radius: var(--gs-radius); font-size: var(--gs-fs-sm); line-height: 1.45; }
.wpcf7 .wpcf7-form.sent .wpcf7-response-output { background: #E6F4EA; color: #14532D; }
.wpcf7 .wpcf7-form:is(.invalid, .unaccepted, .payment-required, .failed, .aborted, .spam) .wpcf7-response-output { background: #FDECEA; color: #8A1C12; }

/* Quote page (single-instive-insurance.php): the blog head (blog.css), then the Elementor
   tabs and forms in a card beside the three facts and the call box (UI/UX round, 25 Oct). */
.gs-legacy { background: var(--gs-mist) url("../../../../uploads/2019/08/quote_bg_texture.png") center top / cover no-repeat; }
.gs-legacy__body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px 48px; align-items: start; padding-block: clamp(28px, 4vw, 48px) clamp(48px, 7vw, 80px); }
@media (min-width: 1100px) {
  .gs-legacy__body { grid-template-columns: minmax(0, 1fr) 300px; }
  .gs-legacy__aside { position: sticky; top: 96px; }
}
.gs-legacy__forms { min-width: 0; padding: clamp(20px, 3vw, 36px); border-top: 4px solid var(--gs-accent); border-radius: var(--gs-radius-lg); background: var(--gs-white); box-shadow: 0 16px 40px rgba(8, 62, 95, 0.1); }
.gs-legacy__forms .e-con, .gs-legacy__forms .e-con-inner { --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; max-width: none !important; padding: 0 !important; }
.gs-legacy__forms .elementor-widget-container { margin: 0 !important; padding: 0 !important; }
.gs-legacy__forms .tab-pane > p { margin: 0 0 18px; color: var(--gs-muted); font: 400 0.9375rem/1.5 var(--gs-font-info); }
.gs-legacy__aside { display: grid; gap: 20px; }
.gs-legacy__facts { display: grid; gap: 14px; margin: 0; padding: 20px 22px; border-radius: var(--gs-radius-lg); background: var(--gs-white); list-style: none; font: 400 0.9375rem/1.5 var(--gs-font-info); color: var(--gs-body); }
.gs-legacy__facts li { display: flex; gap: 10px; align-items: flex-start; }
.gs-legacy__facts .gs-icon { flex: none; width: 22px; height: 22px; padding: 3px; border-radius: var(--gs-radius); background: var(--gs-accent); color: var(--gs-white); stroke-width: 3; }
.gs-legacy__facts strong { display: block; color: var(--gs-navy); font: 700 1rem/1.3 var(--gs-font); }

/* The parent theme centres the page's h1 and pads the tab box. */
.gs-legacy .gs-blog-head h1 { text-align: start; }
.gs-legacy__forms .ts-form-wrap { margin: 0 !important; padding: 0 !important; box-shadow: none !important; background: none !important; }
/* On phones the call box would sit right above the footer's call band. */
@media (max-width: 1099px) {
  .gs-legacy__aside .gs-call-box { display: none; }
}

/* Tabs as chips that wrap (a scrolling row on phones); the current one filled. */
.gs-legacy .ts-tab .nav-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; padding: 0; border: 0; }
.gs-legacy .ts-tab .nav-tabs .nav-item { margin: 0; }
.gs-legacy .ts-tab .nav-tabs .nav-link { display: inline-flex; align-items: center; min-height: 44px; margin: 0; padding: 8px 16px; border: 1px solid var(--gs-line); border-radius: var(--gs-radius); background: var(--gs-white); color: var(--gs-navy); font: 600 0.8125rem/1.2 var(--gs-font); letter-spacing: 0.02em; text-transform: uppercase; }
.gs-legacy .ts-tab .nav-tabs .nav-link:hover { border-color: var(--gs-navy); }
.gs-legacy .ts-tab .nav-tabs .nav-link.active { border-color: var(--gs-navy); background: var(--gs-navy); color: var(--gs-white); }
.gs-legacy .ts-tab .nav-tabs .nav-link::before, .gs-legacy .ts-tab .nav-tabs .nav-link::after { content: none; }
@media (max-width: 699px) {
  .gs-legacy .ts-tab .nav-tabs { flex-wrap: nowrap; overflow-x: auto; margin-inline: -4px; padding: 0 4px 6px; scrollbar-width: thin; }
  .gs-legacy .ts-tab .nav-tabs .nav-item { flex: none; }
  .gs-legacy .ts-tab .nav-tabs .nav-link { white-space: nowrap; }
}

/* Fields in two columns from 700 px; long-question selects, text areas and checkbox groups span both. */
@media (min-width: 700px) {
  .gs-legacy__forms .wpcf7-form > p:first-of-type { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; }
  .gs-legacy__forms .wpcf7-form > p:first-of-type > .wpcf7-form-control-wrap:is(.gs-field-wide, :has(textarea, .wpcf7-checkbox)) { grid-column: 1 / -1; }
}