/*! Bytecode — form validation display (all .bc_form forms) */
:root{--bcv-red:#FF5A5F;--bcv-red-glow:rgba(255,90,95,.18);--bcv-green:#2BD67B}

/* bad field */
form .bc_form_feild.field_invalid,
form input.field_invalid,form select.field_invalid,form textarea.field_invalid,
form .field_invalid + .select2-container .select2-selection,
form .iti:has(.field_invalid) input{
  border-color:var(--bcv-red)!important;
  box-shadow:0 0 0 4px var(--bcv-red-glow)!important;
}
form .bc_form_feild.field_invalid::placeholder{color:#FF9A9D!important;opacity:1}
form .field_invalid{animation:bcv-shake .38s ease}
@keyframes bcv-shake{20%{transform:translateX(-4px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
@media (prefers-reduced-motion:reduce){form .field_invalid{animation:none}}

/* interest chips: red outline on the chips when none is picked */
form .checkbox_list input.field_invalid + span,
form .interested_in_block.bcv-bad .checkbox_item span{
  border-color:var(--bcv-red)!important;
  box-shadow:0 0 0 3px var(--bcv-red-glow)!important;
}

/* message under a field */
form .bcv-msg{
  display:flex;align-items:center;gap:6px;
  margin:7px 0 0 4px!important;padding:0!important;
  font-size:12.5px!important;line-height:1.35!important;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--bcv-red)!important;text-align:left;
}
form .bcv-msg::before{
  content:"!";flex:none;display:inline-grid;place-items:center;width:15px;height:15px;border-radius:50%;
  background:var(--bcv-red);color:#fff;font-size:10px;font-weight:800;line-height:1;
}

/* "Please select any one of the above options" — sit under the chips, not on top of them */
form span.bc_form_error{
  position:static!important;display:none;align-items:center;gap:6px;
  margin:10px 0 4px 4px!important;padding:0!important;
  font-size:12.5px!important;line-height:1.35!important;font-weight:500;
  color:var(--bcv-red)!important;text-align:left;
}
form span.bc_form_error[style*="block"],
form span.bc_form_error[style*="inline"]{display:flex!important}
form span.bc_form_error::before{
  content:"!";flex:none;display:inline-grid;place-items:center;width:15px;height:15px;border-radius:50%;
  background:var(--bcv-red);color:#fff;font-size:10px;font-weight:800;line-height:1;
}

/* summary message under the button */
form .response-message.invalid_error,
form #response-message.invalid_error{
  display:block!important;margin-top:12px!important;padding:11px 14px!important;
  border:1px solid rgba(255,90,95,.45)!important;border-radius:12px!important;
  background:rgba(255,90,95,.08)!important;color:#FF8A8E!important;
  font-size:13.5px!important;line-height:1.45!important;text-align:left!important;
}
form .response-message.invalid_error:empty{display:none!important}

/* "Other" interest: form-validation.js moves its text box out of the chip row into .bcv-other
   (under the chips). It shows only while "Other" is ticked; the chip always stays visible. */
form ul.checkbox_list li:has(.other_interest_checkbox) > label{visibility:visible!important;opacity:1!important}
form .bcv-other{width:100%;margin:10px 0 2px}
form .bcv-other[hidden]{display:none!important}
form .bcv-other input[name="other_interest"]{
  display:block!important;visibility:visible!important;opacity:1!important;
  position:static!important;top:auto!important;left:auto!important;right:auto!important;transform:none!important;
  width:100%!important;max-width:100%!important;box-sizing:border-box!important;
  height:50px!important;min-height:50px!important;margin:0!important;padding:0 18px!important;
  border:1px solid rgba(140,150,170,.35)!important;border-radius:14px!important;
  background:rgba(140,150,170,.06)!important;color:inherit!important;
  font-size:15px!important;font-weight:500;font-family:inherit!important;line-height:1.2!important;outline:0!important;box-shadow:none;
  animation:bcv-in .28s ease both;transition:border-color .2s,box-shadow .2s;
}
form .bcv-other input[name="other_interest"]::placeholder{color:#8A93A3!important;opacity:1}
form .bcv-other input[name="other_interest"]:focus{border-color:#0B66FF!important;box-shadow:0 0 0 4px rgba(11,102,255,.22)!important}
form .bcv-other input[name="other_interest"].field_invalid{border-color:var(--bcv-red)!important;box-shadow:0 0 0 4px var(--bcv-red-glow)!important}
@keyframes bcv-in{from{opacity:0;transform:translateY(-4px)}}