
/* Tokens taken from the live form styling: fields are 15px / radius 8px / border #2e2e2e,
   labels 12px, and #d9534f is the danger colour the theme already uses. */
.elementor-form{
  --sg-msg-danger:#d9534f;
  --sg-msg-danger-text:#f0a7a2;
  --sg-msg-danger-bg:rgba(217,83,79,.10);
  --sg-msg-ok:#c9a24b;
  --sg-msg-ok-text:#e3c98a;
  --sg-msg-ok-bg:rgba(201,162,75,.10);
  --sg-msg-radius:8px;
}

/* The glyph comes from the eicons font, which this site never loads, so it renders
   as a tofu box. Remove the pseudo-element rather than shipping a whole icon font. */
.elementor-form .elementor-message::before,
.elementor-form .elementor-message::after{
  content:none !important;
}

.elementor-form .elementor-message{
  font-family:inherit;
  font-size:13px;
  line-height:1.45;
  font-weight:400;
  letter-spacing:normal;
  text-transform:none;
  overflow-wrap:anywhere;
}

/* Field-level: a quiet line directly beneath the field it belongs to. */
.elementor-form .elementor-message.elementor-help-inline,
.elementor-form .elementor-field-group .elementor-message{
  display:block;
  margin:6px 0 0;
  padding:0;
  background:none;
  border:0;
  color:var(--sg-msg-danger-text);
}

/* Form-level: a restrained panel, aligned to the form, never a full-bleed red block. */
.elementor-form .elementor-message:not(.elementor-help-inline):not(.elementor-field-group .elementor-message){
  display:block;
  margin:14px 0 0;
  padding:10px 12px;
  border:0;
  border-left:3px solid var(--sg-msg-danger);
  border-radius:var(--sg-msg-radius);
  background:var(--sg-msg-danger-bg);
  color:var(--sg-msg-danger-text);
}

/* Success speaks the same language, in the brand accent instead of red.
   The selector repeats the base rule's :not() chain because specificity,
   not order, decides between them - without it the red panel rule wins. */
.elementor-form .elementor-message.elementor-message-success:not(.elementor-help-inline):not(.elementor-field-group .elementor-message){
  border-left-color:var(--sg-msg-ok);
  background:var(--sg-msg-ok-bg);
  color:var(--sg-msg-ok-text);
}

/* Elementor marks invalid fields; keep that cue subtle and consistent. */
.elementor-form .elementor-field-group.elementor-error .elementor-field{
  border-color:var(--sg-msg-danger);
}

/* Messages are injected after submit; reserving the gap stops the layout from jumping. */
.elementor-form .elementor-message-container,
.elementor-form .elementor-form-messages{
  min-height:0;
}

@media (max-width:767px){
  .elementor-form .elementor-message{ font-size:12.5px; }
  .elementor-form .elementor-message:not(.elementor-help-inline):not(.elementor-field-group .elementor-message){
    padding:9px 11px;
    margin-top:12px;
  }
}
