/* AiDi application form — Contact Form 7.

   Written to beat the AiDi theme, which styles forms for a different layout:
     .form-section label        { float: left }        -> labels sat beside fields
     .form-section span         { font-size:15px; color:#E50035 }  -> labels went red
     .form-section input[type=checkbox] { width:auto !important }  -> boxes went oblong
   Everything structural below is scoped to .aidi-form and forced past those. */

/* ---------------------------------------------------------------- the shell */
/* Coloured sections run the full width of the page container; their contents sit
   in a centred column. --aidi-measure is that column - the only number to change
   if the form should read wider or narrower. */
.aidi-form {
  --aidi-measure: 44rem;
  --aidi-gutter: 1.5rem;
  max-width: none;
}
.aidi-form * { box-sizing: border-box; }

/* full-bleed band, centred content: the side padding absorbs the leftover width */
.aidi-form .form-section {
  padding-top: 2rem !important;
  padding-bottom: 2.25rem !important;
  padding-left: max( var(--aidi-gutter), calc( (100% - var(--aidi-measure)) / 2 ) ) !important;
  padding-right: max( var(--aidi-gutter), calc( (100% - var(--aidi-measure)) / 2 ) ) !important;
  border-radius: 20px !important;
  margin: 0 0 1.25rem !important;
  overflow: visible !important;
}

/* anything outside a section lines up with the same column */
.aidi-form > .aidi-req-note,
.aidi-form > p {
  max-width: var(--aidi-measure);
  margin-left: auto !important;
  margin-right: auto !important;
}
.aidi-form h3 {
  font-family: "Funnel Display", termina, sans-serif;
  font-size: 1.35rem !important; line-height: 1.2 !important;
  margin: 0 0 .3rem !important; color: #252C3F !important;
}
.aidi-form .aidi-lede {
  margin: 0 0 1.5rem !important; font-size: .95rem !important;
  font-weight: 400; color: #252C3F; opacity: .85; max-width: 52ch;
}
.aidi-form .aidi-req-note { font-size: .85rem; color: #5A6478; margin: 0 0 1rem; font-weight: 400; }

/* the off-screen band control */
.aidi-form .aidi-band,
.aidi-form .wpcf7-form-control-wrap[data-name="age-band"] {
  position: absolute !important; left: -9999px !important;
  width: 1px !important; height: 1px !important; overflow: hidden !important;
}

/* --------------------------------------------------- one field, always block */
.aidi-form .aidi-field { display: block; clear: both; margin: 0 0 1.5rem; }
.aidi-form .aidi-field:last-child { margin-bottom: 0; }

/* beats .form-section label { float: left } and .form-section span { ... } */
.aidi-form .aidi-label {
  display: block !important; float: none !important; clear: both !important;
  width: auto !important; margin: 0 0 .45rem !important; padding: 0 !important;
  font-size: 1rem !important; line-height: 1.35 !important;
  color: #252C3F !important; font-weight: 400 !important; text-align: left !important;
}
.aidi-form .req { font-size: inherit !important; color: #A32A1C !important; }

/* CF7 wraps every control in this span; inline is what let controls sit sideways */
.aidi-form .wpcf7-form-control-wrap {
  display: block !important; float: none !important; width: auto !important;
  margin: 0 !important; font-size: inherit !important; color: inherit !important;
  line-height: inherit !important;
}

.aidi-form .aidi-hint {
  display: block !important; float: none !important; clear: both !important;
  margin: .4rem 0 0 !important; font-size: .82rem !important; line-height: 1.45 !important;
  color: #5A6478 !important; max-width: 46ch;
}
.aidi-form .aidi-strong { color: #252C3F !important; }
.aidi-form .aidi-hint a { color: #0837A8 !important; }

/* ------------------------------------------------------------------- inputs */
.aidi-form input[type="text"], .aidi-form input[type="email"],
.aidi-form input[type="tel"], .aidi-form input[type="number"],
.aidi-form select, .aidi-form textarea {
  display: block !important; width: 100% !important; max-width: 30rem !important;
  font-family: inherit !important; font-size: 1rem !important; padding: 10px !important;
  color: #252C3F !important; background: #fff !important;
  border: 2px solid #6BB3D6 !important; border-radius: 3px !important;
  margin: 0 !important; float: none !important; height: auto !important;
}
.aidi-form textarea { max-width: 100% !important; min-height: 6rem !important; resize: vertical; }
.aidi-form .aidi-postcode { max-width: 12rem !important; text-transform: uppercase; }
.aidi-form .aidi-stack > .wpcf7-form-control-wrap { margin-bottom: .6rem !important; }
.aidi-form input[type="file"] {
  display: block !important; width: auto !important; max-width: 100%;
  font-size: .9rem !important; border: 0 !important; padding: 0 !important;
}
.aidi-form :focus-visible { outline: 3px solid #0837A8; outline-offset: 2px; }

/* date of birth, three boxes on one line */
.aidi-form .aidi-dob { display: flex !important; gap: .7rem; max-width: 22rem; align-items: flex-end; }
.aidi-form .aidi-dob-part { display: block !important; flex: 1 1 0; min-width: 0; font-size: inherit !important; }
.aidi-form .aidi-dob-year { flex: 1.6 1 0; }
.aidi-form .aidi-sub {
  display: block !important; font-size: .85rem !important; line-height: 1.3 !important;
  color: #5A6478 !important; margin: 0 0 .2rem !important;
}
.aidi-form .aidi-dob input { text-align: center; font-variant-numeric: tabular-nums; max-width: none !important; }

/* -------------------------------------------------- radios and checkboxes */
.aidi-form .wpcf7-form-control.wpcf7-radio,
.aidi-form .wpcf7-form-control.wpcf7-checkbox {
  display: grid !important; grid-template-columns: 1fr; gap: .55rem;
  max-width: 42rem; font-size: inherit !important;
}
@media (min-width: 34rem) {
  .aidi-form .wpcf7-form-control.wpcf7-radio,
  .aidi-form .wpcf7-form-control.wpcf7-checkbox { grid-template-columns: 1fr 1fr; }
}
.aidi-form .wpcf7-list-item { display: block !important; margin: 0 !important; font-size: inherit !important; }
.aidi-form .wpcf7-list-item > label {
  display: flex !important; float: none !important; gap: .75rem; align-items: center;
  width: auto !important; height: 100%; margin: 0 !important; padding: .8rem .9rem !important;
  cursor: pointer; background: #fff; border: 2px solid #6BB3D6; border-radius: 12px;
  font-size: 1rem !important; line-height: 1.3 !important; color: #252C3F !important;
  transition: border-color .12s, background-color .12s;
}
.aidi-form .wpcf7-list-item > label:hover { border-color: #0837A8; }
.aidi-form .wpcf7-list-item-label {
  display: inline !important; font-size: 1rem !important; color: #252C3F !important; line-height: 1.3 !important;
}
/* beats .form-section input[type="checkbox"] { width: auto !important } */
.aidi-form .wpcf7-list-item input[type="radio"],
.aidi-form .wpcf7-list-item input[type="checkbox"] {
  appearance: none; -webkit-appearance: none;
  width: 1.45rem !important; height: 1.45rem !important; min-width: 1.45rem;
  margin: 0 !important; padding: 0 !important; flex: none;
  background: #fff !important; border: 2px solid #6BB3D6 !important;
  cursor: pointer; display: grid !important; place-content: center;
}
.aidi-form .wpcf7-list-item input[type="radio"] { border-radius: 50% !important; }
.aidi-form .wpcf7-list-item input[type="checkbox"] { border-radius: 6px !important; }
.aidi-form .wpcf7-list-item input::before {
  content: ""; transform: scale(0); transition: transform .12s; background: #fff;
}
.aidi-form .wpcf7-list-item input[type="radio"]::before { width: .7rem; height: .7rem; border-radius: 50%; }
.aidi-form .wpcf7-list-item input[type="checkbox"]::before {
  width: .8rem; height: .8rem;
  clip-path: polygon(14% 44%, 0 60%, 39% 100%, 100% 18%, 84% 4%, 39% 69%);
}
.aidi-form .wpcf7-list-item input:checked { background: #0837A8 !important; border-color: #0837A8 !important; }
.aidi-form .wpcf7-list-item input:checked::before { transform: scale(1); }
.aidi-form .wpcf7-list-item > label:has(input:checked) { border-color: #0837A8; background: #EAF3FF; }

/* the three agreement boxes: one per line, same card treatment */
.aidi-form .aidi-agree { margin-bottom: 1.2rem; }
.aidi-form .aidi-agree .wpcf7-form-control.wpcf7-checkbox,
.aidi-form .aidi-agree .wpcf7-form-control.wpcf7-acceptance {
  display: grid !important; grid-template-columns: 1fr !important; max-width: none;
}
.aidi-form .wpcf7-acceptance .wpcf7-list-item { display: block !important; }
.aidi-form .aidi-agree .aidi-hint { margin-left: 3.05rem !important; }

/* ----------------------------------------------------------------- messages */
.aidi-form .aidi-msg {
  display: block; clear: both; border-radius: 12px; padding: .85rem 1rem; margin: 0 0 1.4rem;
  border: 2px solid; font-size: .95rem !important; line-height: 1.45 !important;
}
.aidi-form .aidi-msg strong { display: block; font-weight: 600; font-size: 1rem !important; color: inherit !important; }
.aidi-form .aidi-msg span { font-size: .92rem !important; color: inherit !important; line-height: 1.45 !important; }
.aidi-form .aidi-warn { background: #FFEBCC; border-color: #8A4B00; color: #8A4B00 !important; }
.aidi-form .aidi-stop { background: #FBE0DC; border-color: #A32A1C; color: #A32A1C !important; }

/* ----------------------------------------------------- which partner gets it */
.aidi-form .aidi-route {
  display: flex; clear: both; gap: 1.1rem; align-items: center; flex-wrap: wrap;
  background: #fff; border: 2px solid #0837A8; border-radius: 14px;
  padding: 1rem 1.1rem; margin: 1.4rem 0 0;
}
.aidi-form .aidi-route img { display: block; height: auto; flex: none; max-width: 100%; }
.aidi-form .aidi-route-t { display: block !important; min-width: 12rem; flex: 1; font-size: inherit !important; }
.aidi-form .aidi-route-t strong {
  display: block; font-family: "Funnel Display", termina, sans-serif;
  font-size: 1.05rem !important; line-height: 1.25 !important;
  margin-bottom: .2rem; color: #252C3F !important; font-weight: 600;
}
.aidi-form .aidi-route-t span {
  display: block !important; font-size: .88rem !important;
  color: #5A6478 !important; line-height: 1.45 !important;
}

/* ------------------------------------------------------------------ actions */
.aidi-form .aidi-actions { margin-top: 1.6rem; clear: both; }
.aidi-form .aidi-submit {
  display: inline-block !important; width: auto !important;
  background: #222 !important; color: #fff !important;
  border: 0 !important; border-radius: 15px !important;
  padding: 15px 30px !important; min-height: 52px;
  font-family: inherit !important; font-size: 1rem !important; cursor: pointer;
}
.aidi-form .aidi-submit:hover { background: #0837A8 !important; }
.aidi-form .wpcf7-spinner { vertical-align: middle; }

/* CF7's own validation text */
.aidi-form .wpcf7-not-valid-tip {
  display: block !important; margin-top: .35rem !important;
  font-size: .85rem !important; color: #A32A1C !important; line-height: 1.4 !important;
}
.aidi-form .wpcf7-response-output {
  clear: both; margin: 1.4rem 0 0 !important; padding: .85rem 1rem !important;
  border-radius: 12px !important; border-width: 2px !important; font-size: .95rem !important;
}

@media (prefers-reduced-motion: reduce) { .aidi-form * { transition: none !important; } }