/* Smoke Machines contact form: VirtualNet forms markup styled to match the site (accent #00aad2, PT Sans). */
.vn-form {
  --vn-accent: #00aad2;
  --vn-accent-dark: #007a99;
  --vn-text: #444;
  --vn-muted: #6f6f6f;
  --vn-border: #cfcfcf;
  --vn-field-bg: #fff;
  --vn-error: #b00020;

  display: grid;
  gap: 0.9rem;
  margin-block-start: 1.75rem;
  padding: 1.1rem;
  border: 1px solid #e3e3e3;
  border-block-start: 4px solid var(--vn-accent);
  border-radius: 0.35rem;
  background: #fafafa;
  color: var(--vn-text);
  font-size: 0.8125rem;

  & .vn-form__title { margin: 0; color: #333; font-size: 1rem; }
  & .vn-form__hint { margin: 0; color: var(--vn-muted); font-size: 0.75rem; }

  & .vn-form__field { display: grid; gap: 0.3rem; }

  & label { font-weight: 700; color: #333; }
  & .required { color: var(--vn-error); }
  & .vn-form__optional { font-weight: 400; color: var(--vn-muted); }

  & :is(input, textarea) {
    box-sizing: border-box;
    inline-size: 100%;
    margin: 0;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--vn-border);
    border-radius: 0.25rem;
    background: var(--vn-field-bg);
    color: var(--vn-text);
    font: inherit;
    font-size: 1rem; /* 16px stops iOS zooming on focus */
    line-height: 1.4;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }

  & textarea { block-size: auto; min-block-size: 8rem; resize: vertical; }

  & :is(input, textarea):hover { border-color: #9a9a9a; }

  /* The site's stylesheet removes outlines with !important; restore a clear focus ring. */
  & :is(input, textarea):focus-visible {
    border-color: var(--vn-accent);
    outline: 2px solid var(--vn-accent) !important;
    outline-offset: 1px;
    box-shadow: 0 0 0 4px rgb(0 170 210 / 0.15);
  }

  & :is(input, textarea)[aria-invalid="true"] {
    background: #fff6f7;
    box-shadow: 0 0 0 3px rgb(176 0 32 / 0.12);
  }

  & .vn-form__error { font-weight: 600; }

  & .vn-form__submit {
    justify-self: start;
    min-block-size: 2.75rem;
    padding: 0.6rem 1.4rem;
    border: 0;
    border-radius: 0.25rem;
    background: var(--vn-accent-dark);
    color: #fff;
    font: inherit;
    font-size: 0.9375rem;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.15s ease;

    &:hover { background: #00627b; }
    &:focus-visible { outline: 3px solid #333 !important; outline-offset: 2px; }
    &:disabled { cursor: progress; opacity: 0.7; }
  }

  & .vn-form-status { margin: 0; font-size: 0.875rem; }
}

/* Honeypot from the admin snippet: off-screen for people, still in the form for bots. */
.vn-form__trap,
.vn-form__sr {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.vn-form__trap { inset-inline-start: -10000px; }


@media (max-width: 47.9375em) {
  .vn-form .vn-form__submit { justify-self: stretch; }
}

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