/* ===================== FORMS — real fields + host-theme guards =====================
   Loaded LAST. Neutralizes WordPress host-theme (Hello Elementor / WooCommerce /
   Elementor) form styling that otherwise stretches inputs to 100% and paints red
   invalid/focus borders. Harmless in the standalone build (values match the design). */

/* ---- Text inputs: lock exact design over any theme rule ---- */
.form-field,.m-form-field,.join__field,.join__field--m{
  -webkit-appearance:none;appearance:none;
  border:none !important;
  border-bottom:2px solid var(--c-dark-blue) !important;
  box-shadow:none !important;
  outline:none !important;
  min-height:0 !important;
  max-width:none !important;
  line-height:normal !important;
  margin:0 !important;
}
.form-field{width:371px !important;height:56px !important;border-radius:6px !important;background:var(--c-field) !important;}
.m-form-field{width:282.7px !important;height:42.7px !important;border-radius:6px !important;background:var(--c-field) !important;}
.join__field{height:56px !important;border-radius:6px !important;background:#fff !important;}
.join__field--name,.join__field--email{width:334px !important;}
.join__field--phone{width:327px !important;}
.join__field--city{width:328px !important;}
.join__field--m{width:318px !important;height:43px !important;border-radius:4.5px !important;background:#fff !important;}

/* focus / invalid must NOT turn red */
.form-field:focus,.m-form-field:focus,.join__field:focus,.join__field--m:focus{
  border-bottom:2px solid var(--c-blue) !important;box-shadow:none !important;outline:none !important;
}
.form-field:invalid,.m-form-field:invalid,.join__field:invalid,.join__field--m:invalid{
  border-bottom:2px solid var(--c-dark-blue) !important;box-shadow:none !important;
}

/* ---- Real, toggleable consent checkbox (was a decorative div) ---- */
.form-check,.m-form-check,.join__check,.join__check--m{
  -webkit-appearance:none;appearance:none;cursor:pointer;
  border:none !important;outline:none !important;box-shadow:none !important;
  background-color:var(--c-dark-blue);background-repeat:no-repeat;background-position:center;
}
.form-check:checked,.m-form-check:checked,.join__check:checked,.join__check--m:checked{
  background-color:var(--c-dark-blue) !important;
  background-image:url('../icons/check.svg');
  background-size:72%;
}
.form-check:not(:checked),.m-form-check:not(:checked),.join__check:not(:checked),.join__check--m:not(:checked){
  background-color:#fff !important;
  box-shadow:inset 0 0 0 2px var(--c-dark-blue) !important;
}
/* the old <img> inside the check is gone; hide if any theme injects one */
.form-check img,.m-form-check img,.join__check img,.join__check--m img{display:none;}

/* ---- Submit buttons / bottom bar: kill theme border + bg ---- */
.form-submit,.m-form-submit,.join__submit,.join__submit--m,.join__bar--m{
  -webkit-appearance:none;appearance:none;
  border:none !important;outline:none !important;box-shadow:none !important;
  background:var(--grad-gold-btn) !important;cursor:pointer;
}
.form-submit:focus,.m-form-submit:focus,.join__submit:focus,.join__submit--m:focus{outline:none !important;box-shadow:none !important;}

/* ---- Hamburger + nav: stop host-theme button/list defaults breaking them ---- */
.hdr__burger{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;-webkit-appearance:none;appearance:none;}
.hdr__burger span{display:block !important;}
.hdr__menu{list-style:none !important;margin:0 !important;}
.hdr__nav a,.hdr__menu a,.hdr__cta,.hdr__cta--m,.hero__cta,.side-cta,.sticky-cta{text-decoration:none !important;}

/* anchor scroll target offset */
#content-now{scroll-margin-top:20px;}

/* ---- Floating join CTAs removed v8 (2026-05-31, Yuval request) ---- */
.side-cta, .sticky-cta { display: none !important; }

/* ===================== v7 fixes (2026-05-31): unified asterisks + sticky CTA fit ===================== */

/* Required asterisks: red, uniform, anchored to the visual LEFT of each field
   (in RTL with text-align:right, visual-left is the gap before text starts). */
.form-field, .m-form-field, .join__field, .join__field--m {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Ctext x='6' y='10.5' text-anchor='middle' font-family='Arial,sans-serif' font-size='15' font-weight='700' fill='%23E2231A'%3E*%3C/text%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 10px center !important;
  background-size: 11px 11px !important;
  padding-left: 26px !important;
}
.m-form-field, .join__field--m {
  background-position: 8px center !important;
  background-size: 9px 9px !important;
  padding-left: 20px !important;
}

/* ===================== v9 (2026-06-10): submit lock spinner + JS validation =====================
   Stops the double/triple submit: while the request is in flight the button is
   disabled and shows a spinner + "חישוב…". Invalid fields use the standard
   reusable Hebrew validation format (red ring + 11px message, top-left in field). */

/* Field flagged invalid — red ring (#c0392b). Scoped with the field class so it
   beats the design's `.form-field:invalid{box-shadow:none}` (equal specificity, later). */
.form-field.netsah-invalid, .m-form-field.netsah-invalid,
.join__field.netsah-invalid, .join__field--m.netsah-invalid,
.form-field.netsah-invalid:focus, .m-form-field.netsah-invalid:focus,
.join__field.netsah-invalid:focus, .join__field--m.netsah-invalid:focus {
  border-bottom-color: #c0392b !important;
  box-shadow: inset 0 0 0 1.5px #c0392b !important;
}

/* Per-field error message — 11px red, anchored to the field's top-left corner.
   Positioned by JS (offsetLeft/offsetTop of the field); inset so it never overlaps neighbours. */
.netsah-err {
  position: absolute;
  display: none;
  z-index: 50; /* above the form fields (z-index:11) so the message is visible */
  font-family: Assistant, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: #c0392b;
  pointer-events: none;
  white-space: nowrap;
}

/* Disabled / loading submit button */
.form-submit:disabled, .m-form-submit:disabled, .join__submit:disabled, .join__submit--m:disabled,
.form-submit.is-loading, .m-form-submit.is-loading, .join__submit.is-loading, .join__submit--m.is-loading {
  opacity: .85 !important;
  cursor: wait !important;
}
/* Only when loading: lay the spinner next to the label (normal state untouched) */
.form-submit.is-loading span, .m-form-submit.is-loading span,
.join__submit.is-loading span, .join__submit--m.is-loading span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}
.netsah-spin {
  width: 16px; height: 16px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,.45);
  border-top-color: #fff;
  display: inline-block;
  animation: netsah-spin .7s linear infinite;
}
@keyframes netsah-spin { to { transform: rotate(360deg); } }