/* ===========================================================
   TMT Framework
   Component: Contact Form
   Status: Active
   Version: 1.5 RC
   =========================================================== */

/* ===========================================================
   TMT Contact Form CSS
   Plugin-free contact form styling.
   Supports .tmt-contact-form markup only.
   =========================================================== */

/* Hidden anti-spam / tracking fields
   ----------------------------------------------------------- */

.tmt-hidden-fields{
  position:absolute !important;
  left:-9999px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.tmt-contact-form input[name="company"]{
  position:absolute !important;
  left:-9999px !important;
  height:0 !important;
  width:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* ===========================================================
   TMT contact card layout
   Migrated from tmt-layout.css so the contact component owns its layout.
   =========================================================== */

#contact .card.tmt-contact-card{
  display:block;
  padding:35px !important;
  background:var(--tmt-panel-grad) !important;
  color:var(--tmt-card-text,var(--text)) !important;
  border:1px solid rgba(0,0,0,.06) !important;
  box-shadow:0 4px 10px rgba(0,0,0,.08) !important;
  border-radius:12px;
}

html[data-tmt-theme="light"] #contact .card.tmt-contact-card{
  background:var(--tmt-panel-grad) !important;
  color:var(--tmt-card-text) !important;
  border-color:rgba(0,0,0,.08) !important;
  box-shadow:0 4px 10px rgba(0,0,0,.10) !important;
}

html[data-tmt-theme="dark"] #contact .card.tmt-contact-card{
  background:var(--tmt-panel-grad) !important;
  color:var(--tmt-card-text) !important;
  border:1px solid var(--tmt-border,rgba(255,255,255,.08)) !important;
  box-shadow:var(--tmt-shadow,0 4px 10px rgba(0,0,0,.35)) !important;
}

@media (hover:hover){
  #contact .card.tmt-contact-card:hover{
    transform:translateY(-5px);
    box-shadow:0 10px 24px rgba(0,0,0,.14) !important;
  }

  html[data-tmt-theme="dark"] #contact .card.tmt-contact-card:hover{
    box-shadow:var(--tmt-shadow-hover,0 10px 24px rgba(0,0,0,.45)) !important;
  }
}

#contact .tmt-contact-intro{
  margin:0 0 35px;
  max-width:none;
}

#contact .tmt-contact-intro h3,
#contact .tmt-contact-intro h4{
  margin:0 0 .65rem;
}

#contact .tmt-contact-intro p{
  margin:0;
  line-height:1.7;
}

#contact .tmt-contact-layout{
  display:grid;
  grid-template-columns:minmax(240px,.42fr) minmax(360px,.58fr);
  gap:35px;
  align-items:start;
}

#contact .tmt-contact-info,
#contact .tmt-contact-panel{
  min-width:0;
}

#contact .tmt-contact-info{
  display:flex;
  flex-direction:column;
  gap:1.6rem;
  padding-top:2.15rem;
}

#contact .tmt-contact-locations{
  display:none;
}

#contact .tmt-contact-note-block{
  display:grid;
  grid-template-columns:1.45rem 1fr;
  column-gap:.65rem;
  align-items:start;
  padding-top:1.15rem;
  border-top:1px solid rgba(0,0,0,.12);
}

html[data-tmt-theme="dark"] #contact .tmt-contact-note-block{
  border-top-color:rgba(255,255,255,.12);
}

#contact .tmt-contact-note-block + .tmt-contact-note-block{
  margin-top:1.25rem;
}

#contact .tmt-contact-note-block::before{
  content:"";
  width:1rem;
  height:1rem;
  margin-top:.36rem;
  opacity:.72;
  background:currentColor;
  -webkit-mask:center / contain no-repeat;
          mask:center / contain no-repeat;
}

#contact .tmt-contact-note-block.tmt-worldwide::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E");
}

#contact .tmt-contact-note-block.tmt-contact-mail::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5.5' width='17' height='13' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5.5' width='17' height='13' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E");
}

#contact .tmt-contact-note-block h4,
#contact .tmt-contact-note-block p{
  grid-column:2;
}

#contact .tmt-contact-note-block h4{
  margin:0 0 .45rem;
}

#contact .tmt-contact-note-block p{
  margin:0;
  line-height:1.7;
}

#contact .tmt-contact-obfuscated{
  opacity:.85;
}

#contact .tmt-hidden-fields{
  display:none;
}

#contact .tmt-contact-panel > :first-child,
#contact .tmt-contact-form > :first-child{
  margin-top:0;
}

#contact .tmt-contact-panel > :last-child,
#contact .tmt-contact-form > :last-child{
  margin-bottom:0;
}

#contact .tmt-contact-form{
  max-width:520px;
  margin-left:auto;
  width:100%;
}

#contact .tmt-contact-form .tmt-form-control{
  width:100%;
}

#contact .tmt-form-submit-row{
  max-width:520px;
}

@media (max-width:900px){
  #contact .tmt-contact-layout{
    grid-template-columns:1fr;
  }

  #contact .tmt-contact-info{
    padding-top:0;
  }

  #contact .tmt-contact-form,
  #contact .tmt-form-submit-row{
    max-width:none;
    margin-left:0;
  }
}

@media (max-width:700px){
  #contact .card.tmt-contact-card{
    padding:28px !important;
  }

  #contact .tmt-contact-intro{
    margin-bottom:28px;
  }
}

/* Contact card / panel
   ----------------------------------------------------------- */

#contact .tmt-contact-form-wrap{
  max-width:1200px;
  width:100%;
  margin-inline:auto;
  padding:1.2rem 1.5rem;
  border-radius:var(--tmt-radius);
  background:var(--tmt-panel-grad, var(--section-bg)) !important;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 4px 10px rgba(0,0,0,.08);
  transition:var(--hover-transition);
}

#contact .tmt-contact-card{
  transform:translateY(0) !important;
  box-shadow:var(--tmt-shadow) !important;
  transition:transform var(--tmt-transition), box-shadow var(--tmt-transition) !important;
}

@media (hover:hover){
  #contact .tmt-contact-form-wrap:hover,
  #contact .tmt-contact-card:hover{
    transform:translateY(calc(-1 * var(--tmt-hover-lift, 5px))) !important;
    box-shadow:var(--tmt-shadow-hover) !important;
    filter:none !important;
  }
}

#contact .tmt-contact-layout{
  --tmt-contact-message-top:35px;
  --tmt-contact-name-offset:26px;
  --tmt-contact-info-offset:35px;
}

#contact .tmt-contact-panel{
  --tmt-contact-message-gap:.75rem;
  position:relative;
  min-width:0;
  padding-top:var(--tmt-contact-name-offset);
}

/* Align the first visible form label with the left note line.
   The response box is positioned above the form, so success/error
   messages do not push the form downward. */
#contact .tmt-contact-info{
  padding-top:var(--tmt-contact-info-offset) !important;
}
/* Reserved response area
   ----------------------------------------------------------- */

#contact .tmt-form-response{
  position:absolute;
  top:var(--tmt-contact-message-top);
  right:0;
  transform:translateY(calc(-100% - var(--tmt-contact-message-gap)));
  z-index:2;
  display:flex !important;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  max-width:100%;
  min-height:58px;
  margin:0;
  padding:.55rem .75rem;
  border:1px solid transparent;
  border-radius:var(--tmt-radius-small, 8px);
  font-size:.92rem;
  line-height:1.25;
  text-align:left;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .18s ease, visibility .18s ease, background-color .18s ease, border-color .18s ease;
}

#contact .tmt-form-response:not([hidden]){
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

#contact .tmt-form-response.tmt-form-success{
  color:#166534 !important;
  -webkit-text-fill-color:#166534 !important;
  border-color:rgba(22,163,74,.35);
  background:rgba(22,163,74,.08);
}

#contact .tmt-form-response.tmt-form-error{
  color:#991b1b !important;
  -webkit-text-fill-color:#991b1b !important;
  border-color:rgba(220,38,38,.35);
  background:rgba(220,38,38,.08);
}

@media (max-width:900px){
  #contact .tmt-contact-layout{
    --tmt-contact-message-top:0;
    --tmt-contact-name-offset:0;
    --tmt-contact-info-offset:0;
  }

  #contact .tmt-contact-panel,
  #contact .tmt-contact-info{
    padding-top:0 !important;
  }

  #contact .tmt-form-response{
    position:relative;
    top:auto;
    right:auto;
    transform:none;
    width:100%;
    min-height:66px;
    margin:0 0 .75rem;
    white-space:normal;
  }
}

/* Form spacing
   ----------------------------------------------------------- */

#contact .tmt-contact-form{
  margin:0;
  padding:0;
}

#contact .tmt-contact-form p{
  margin:.4rem 0;
}


#contact .tmt-contact-form > p:first-of-type{
  margin-top:0 !important;
}

#contact .tmt-contact-form label{
  display:block;
  margin:.25rem 0 .25rem;
  font-size:.95rem;
  font-weight:600;
}


#contact .tmt-contact-form > p:first-of-type > label{
  margin-top:0 !important;
}

/* Fields
   ----------------------------------------------------------- */

#contact .tmt-form-control,
#contact .tmt-contact-form input:not([type=submit]):not([type=checkbox]):not([type=hidden]),
#contact .tmt-contact-form textarea,
#contact .tmt-contact-form select{
  display:block;
  width:100%;
  max-width:100%;
  padding:.65rem .75rem;
  font-size:.95rem;
  line-height:1.35;
  border:1px solid #ddd;
  border-radius:6px;
  color:#333;
  background:#fff;
  transition:border-color .25s ease, box-shadow .25s ease, background-color .25s ease;
}

#contact .tmt-form-control:focus,
#contact .tmt-contact-form input:not([type=submit]):not([type=checkbox]):not([type=hidden]):focus,
#contact .tmt-contact-form textarea:focus,
#contact .tmt-contact-form select:focus{
  border-color:#000;
  box-shadow:0 0 0 3px rgba(0,0,0,.08);
  outline:0;
}

#contact .tmt-form-textarea,
#contact .tmt-contact-form textarea{
  min-height:90px;
  max-height:140px;
  resize:vertical;
}

/* Required field error highlighting
   ----------------------------------------------------------- */

#contact .tmt-contact-form .tmt-field-error,
#contact .tmt-contact-form.tmt-form-was-submitted input[required]:invalid:not([type=checkbox]),
#contact .tmt-contact-form.tmt-form-was-submitted textarea[required]:invalid,
#contact .tmt-contact-form.tmt-form-was-submitted select[required]:invalid{
  border-color:#dc2626 !important;
  background:rgba(220,38,38,.055) !important;
  box-shadow:0 0 0 3px rgba(220,38,38,.12) !important;
}

#contact .tmt-field-error-row > label,
#contact .tmt-form-acceptance.tmt-field-error label{
  color:#991b1b !important;
  -webkit-text-fill-color:#991b1b !important;
}

#contact .tmt-form-acceptance.tmt-field-error{
  border-radius:8px;
  background:rgba(220,38,38,.055);
  box-shadow:0 0 0 3px rgba(220,38,38,.10);
}

/* Privacy checkbox row
   ----------------------------------------------------------- */

#contact .tmt-form-acceptance{
  max-width:100% !important;
}

#contact .tmt-form-acceptance label{
  display:grid !important;
  grid-template-columns:16px 1fr !important;
  column-gap:.5rem !important;
  align-items:start !important;
  font-weight:600;
}

#contact .tmt-form-acceptance input[type=checkbox]{
  grid-column:1 !important;
  width:16px !important;
  height:16px !important;
  margin:.2em 0 0 0 !important;
}

#contact .tmt-form-acceptance-label{
  grid-column:2 !important;
  overflow-wrap:anywhere !important;
  line-height:1.4 !important;
}

@media (max-width:768px){
  #contact .tmt-form-acceptance-label{
    font-size:clamp(12px,2.6vw,14px) !important;
  }
}

/* Submit button
   Size is intentionally preserved: height, padding, font-size,
   min-width and width match the previous contact-form.css.
   ----------------------------------------------------------- */

#contact .tmt-form-submit-row{
  text-align:center;
}

#contact .tmt-form-submit,
#contact .tmt-contact-form button[type="submit"],
#contact .tmt-contact-form input[type="submit"]{
  appearance:none;
  height:56px;
  padding:0 1.5rem;
  font-size:1rem;
  font-weight:700 !important;
  border-radius:var(--tmt-radius);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:1.5rem auto 0;
  width:auto;
  min-width:140px;
  cursor:pointer;
  border:1px solid transparent !important;
  outline:0 !important;
  box-shadow:var(--tmt-shadow) !important;
  text-decoration:none !important;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    background-color .18s ease,
    color .18s ease,
    border-color .18s ease,
    opacity .18s ease !important;
}

#contact .tmt-form-submit:disabled,
#contact .tmt-contact-form button[type="submit"]:disabled,
#contact .tmt-contact-form input[type="submit"]:disabled{
  opacity:.6;
  cursor:not-allowed;
  transform:none !important;
}

/* Dark mode submit: white to black */
html[data-tmt-theme="dark"] #contact .tmt-form-submit,
html[data-tmt-theme="dark"] #contact .tmt-contact-form button[type="submit"],
html[data-tmt-theme="dark"] #contact .tmt-contact-form input[type="submit"],
html:not([data-tmt-theme]) #contact .tmt-form-submit,
html:not([data-tmt-theme]) #contact .tmt-contact-form button[type="submit"],
html:not([data-tmt-theme]) #contact .tmt-contact-form input[type="submit"]{
  background:#ffffff !important;
  color:#000000 !important;
  -webkit-text-fill-color:#000000 !important;
}

html[data-tmt-theme="dark"] #contact .tmt-form-submit:hover,
html[data-tmt-theme="dark"] #contact .tmt-form-submit:focus-visible,
html[data-tmt-theme="dark"] #contact .tmt-contact-form button[type="submit"]:hover,
html[data-tmt-theme="dark"] #contact .tmt-contact-form button[type="submit"]:focus-visible,
html[data-tmt-theme="dark"] #contact .tmt-contact-form input[type="submit"]:hover,
html[data-tmt-theme="dark"] #contact .tmt-contact-form input[type="submit"]:focus-visible,
html:not([data-tmt-theme]) #contact .tmt-form-submit:hover,
html:not([data-tmt-theme]) #contact .tmt-form-submit:focus-visible,
html:not([data-tmt-theme]) #contact .tmt-contact-form button[type="submit"]:hover,
html:not([data-tmt-theme]) #contact .tmt-contact-form button[type="submit"]:focus-visible,
html:not([data-tmt-theme]) #contact .tmt-contact-form input[type="submit"]:hover,
html:not([data-tmt-theme]) #contact .tmt-contact-form input[type="submit"]:focus-visible{
  background:#000000 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  transform:translateY(-2px) !important;
  box-shadow:var(--tmt-shadow-hover) !important;
}

/* Light mode submit: black to white */
html[data-tmt-theme="light"] #contact .tmt-form-submit,
html[data-tmt-theme="light"] #contact .tmt-contact-form button[type="submit"],
html[data-tmt-theme="light"] #contact .tmt-contact-form input[type="submit"]{
  background:#000000 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

html[data-tmt-theme="light"] #contact .tmt-form-submit:hover,
html[data-tmt-theme="light"] #contact .tmt-form-submit:focus-visible,
html[data-tmt-theme="light"] #contact .tmt-contact-form button[type="submit"]:hover,
html[data-tmt-theme="light"] #contact .tmt-contact-form button[type="submit"]:focus-visible,
html[data-tmt-theme="light"] #contact .tmt-contact-form input[type="submit"]:hover,
html[data-tmt-theme="light"] #contact .tmt-contact-form input[type="submit"]:focus-visible{
  background:#ffffff !important;
  color:#000000 !important;
  -webkit-text-fill-color:#000000 !important;
  transform:translateY(-2px) !important;
  box-shadow:var(--tmt-shadow-hover) !important;
}


/* Submit border safety
   ----------------------------------------------------------- */

#contact .tmt-form-submit,
#contact .tmt-form-submit:hover,
#contact .tmt-form-submit:focus-visible,
#contact .tmt-contact-form button[type="submit"],
#contact .tmt-contact-form button[type="submit"]:hover,
#contact .tmt-contact-form button[type="submit"]:focus-visible,
#contact .tmt-contact-form input[type="submit"],
#contact .tmt-contact-form input[type="submit"]:hover,
#contact .tmt-contact-form input[type="submit"]:focus-visible,
html[data-tmt-theme="dark"] #contact .tmt-form-submit,
html[data-tmt-theme="dark"] #contact .tmt-form-submit:hover,
html[data-tmt-theme="dark"] #contact .tmt-form-submit:focus-visible,
html[data-tmt-theme="light"] #contact .tmt-form-submit,
html[data-tmt-theme="light"] #contact .tmt-form-submit:hover,
html[data-tmt-theme="light"] #contact .tmt-form-submit:focus-visible{
  border-color:transparent !important;
  outline:0 !important;
}

/* Spinner
   ----------------------------------------------------------- */

#contact .tmt-form-spinner{
  display:none;
}

/* Dark mode integration
   ----------------------------------------------------------- */

html[data-tmt-theme="dark"] #contact .tmt-contact-form-wrap{
  background:var(--tmt-panel-grad) !important;
  border-color:rgba(255,255,255,.08);
  box-shadow:0 4px 10px rgba(0,0,0,.35);
}

html[data-tmt-theme="dark"] #contact .tmt-contact-form-wrap,
html[data-tmt-theme="dark"] #contact .tmt-contact-form-wrap *{
  color:#fff;
}

html[data-tmt-theme="dark"] #contact .tmt-form-control,
html[data-tmt-theme="dark"] #contact .tmt-contact-form input:not([type=submit]):not([type=checkbox]):not([type=hidden]),
html[data-tmt-theme="dark"] #contact .tmt-contact-form textarea,
html[data-tmt-theme="dark"] #contact .tmt-contact-form select{
  color:#fff;
  -webkit-text-fill-color:#fff;
  background:#111;
  border-color:rgba(255,255,255,.18);
}

html[data-tmt-theme="dark"] #contact .tmt-form-control:focus,
html[data-tmt-theme="dark"] #contact .tmt-contact-form input:not([type=submit]):not([type=checkbox]):not([type=hidden]):focus,
html[data-tmt-theme="dark"] #contact .tmt-contact-form textarea:focus,
html[data-tmt-theme="dark"] #contact .tmt-contact-form select:focus{
  border-color:#fff;
  box-shadow:0 0 0 3px rgba(255,255,255,.12);
}

html[data-tmt-theme="dark"] #contact .tmt-form-acceptance a{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:3px;
}

html[data-tmt-theme="dark"] #contact .tmt-form-response.tmt-form-success{
  color:#bbf7d0 !important;
  -webkit-text-fill-color:#bbf7d0 !important;
  border-color:rgba(74,222,128,.4);
  background:rgba(74,222,128,.12);
}

html[data-tmt-theme="dark"] #contact .tmt-form-response.tmt-form-error{
  color:#fecaca !important;
  -webkit-text-fill-color:#fecaca !important;
  border-color:rgba(248,113,113,.45);
  background:rgba(248,113,113,.12);
}

html[data-tmt-theme="dark"] #contact .tmt-contact-form .tmt-field-error,
html[data-tmt-theme="dark"] #contact .tmt-contact-form.tmt-form-was-submitted input[required]:invalid:not([type=checkbox]),
html[data-tmt-theme="dark"] #contact .tmt-contact-form.tmt-form-was-submitted textarea[required]:invalid,
html[data-tmt-theme="dark"] #contact .tmt-contact-form.tmt-form-was-submitted select[required]:invalid{
  border-color:#f87171 !important;
  background:rgba(248,113,113,.08) !important;
  box-shadow:0 0 0 3px rgba(248,113,113,.16) !important;
}

html[data-tmt-theme="dark"] #contact .tmt-field-error-row > label,
html[data-tmt-theme="dark"] #contact .tmt-form-acceptance.tmt-field-error label{
  color:#fecaca !important;
  -webkit-text-fill-color:#fecaca !important;
}
/* ===========================================================
   TMT Framework
   Component: Contact Form JS
   Status: Active
   Version: 1.2 RC
   =========================================================== */

/* global SinatraLang */
document.addEventListener('DOMContentLoaded', function () {
  const form =
    document.querySelector('form.tmt-contact-form');

  if (!form) return;

  const formWrap = form.closest('.tmt-contact-form-wrap') || form.parentElement;

  const resp =
    (formWrap && formWrap.querySelector('.tmt-form-response')) ||
    form.querySelector('.tmt-form-response') ||
    (form.closest('.tmt-contact-panel') && form.closest('.tmt-contact-panel').querySelector('.tmt-form-response'));

  const spinner =
    form.querySelector('.tmt-form-spinner');

  const submitBtn =
    form.querySelector('.tmt-form-submit') ||
    form.querySelector('input[type="submit"]') ||
    form.querySelector('button[type="submit"]');

  const qs = new URLSearchParams(window.location.search);
  const setText = (el, text) => { if (el) el.textContent = text || ''; };
  const normOrigin = location.origin;

  // Honeypot / timing initialisation
  const formTime = form.querySelector('input[name="form_time"]');
  if (formTime) {
    formTime.value = String(Math.floor(performance.now() + Date.now()));
  }

  // Detect language from URL or <html lang>
  function detectLang() {
    const p = (location.pathname || '/').toLowerCase();
    if (p.indexOf('/de/') === 0) return 'de';
    if (p.indexOf('/en/') === 0) return 'en';

    const htmlLang = (document.documentElement.getAttribute('lang') || '')
      .slice(0, 2)
      .toLowerCase();

    if (['en', 'de', 'zh'].includes(htmlLang)) return htmlLang;
    return 'zh';
  }

  const pageLang = detectLang();

  // Ensure hidden lang input exists
  let langInput = form.querySelector('input[name="lang"]');
  if (!langInput) {
    langInput = document.createElement('input');
    langInput.type = 'hidden';
    langInput.name = 'lang';
    form.appendChild(langInput);
  }

  if (!langInput.value) {
    langInput.value = pageLang;
  }

  // Force ?lang=… onto action so backend sees language
  try {
    const url = new URL(form.action || '/api/submit.php', normOrigin);
    if (!url.searchParams.get('lang')) {
      url.searchParams.set('lang', pageLang);
      form.action = url.toString();
    }
  } catch (e) {
    // ignore; submit handler will fall back to /api/submit.php
  }

  // UTM & click IDs from query to hidden fields
  [
    'utm_source',
    'utm_medium',
    'utm_campaign',
    'utm_term',
    'utm_content',
    'gclid',
    'fbclid'
  ].forEach((name) => {
    const input = form.querySelector(`input[name="${name}"]`);
    if (input && qs.has(name)) input.value = qs.get(name);
  });

  // Localized UI strings
  const messages = {
    en: {
      sending: 'Sending…',
      submit: 'Submit',
      thanks: 'Thank you!',
      required: 'Please fill in the required fields.',
      neterr: 'Network error — please try again.'
    },
    de: {
      sending: 'Senden…',
      submit: 'Senden',
      thanks: 'Vielen Dank!',
      required: 'Bitte fülle die Pflichtfelder aus.',
      neterr: 'Netzwerkfehler – bitte erneut versuchen.'
    },
    zh: {
      sending: '发送中…',
      submit: '提交',
      thanks: '谢谢！',
      required: '请填写必填字段。',
      neterr: '网络错误，请重试。'
    }
  };

  const M = messages[pageLang] || messages.en;

  function showMessage(text, isError = false) {
    if (!resp) return;

    setText(resp, text);
    resp.hidden = false;
    resp.style.display = 'flex';
    resp.style.visibility = 'visible';
    resp.setAttribute('aria-hidden', 'false');

    // New TMT classes
    resp.classList.remove('tmt-form-success', 'tmt-form-error');
    resp.classList.add(isError ? 'tmt-form-error' : 'tmt-form-success');
  }

  function hideMessage() {
    if (!resp) return;

    resp.hidden = true;
    resp.style.display = 'flex';
    resp.style.visibility = 'hidden';
    resp.setAttribute('aria-hidden', 'true');
    resp.classList.remove('tmt-form-success', 'tmt-form-error');
    setText(resp, '');
  }

  function setBusy(busy) {
    if (spinner) {
      spinner.style.visibility = busy ? 'visible' : 'hidden';
      spinner.style.display = busy ? 'inline-block' : 'none';
    }

    if (submitBtn) {
      submitBtn.disabled = busy;

      if (submitBtn.tagName === 'BUTTON') {
        submitBtn.textContent = busy ? M.sending : M.submit;
      } else {
        submitBtn.value = busy ? M.sending : M.submit;
      }
    }

    form.setAttribute('data-status', busy ? 'submitting' : 'init');
  }

  function isRequiredField(field) {
    if (!field || field.disabled) return false;

    const type = (field.getAttribute('type') || '').toLowerCase();
    if (type === 'hidden' || type === 'submit' || type === 'button') return false;
    if (field.name === 'company') return false;

    return field.hasAttribute('required') || field.getAttribute('aria-required') === 'true';
  }

  function isInvalidRequiredField(field) {
    if (!isRequiredField(field)) return false;

    const type = (field.getAttribute('type') || '').toLowerCase();

    if (type === 'checkbox' || type === 'radio') {
      return !field.checked;
    }

    const value = String(field.value || '').trim();
    if (!value) return true;

    if (typeof field.checkValidity === 'function') {
      return !field.checkValidity();
    }

    return false;
  }

  function getFieldRow(field) {
    if (!field) return null;
    return field.closest('.tmt-form-acceptance') || field.closest('p') || field.parentElement;
  }

  function setFieldError(field, invalid) {
    if (!field) return;

    const row = getFieldRow(field);
    const acceptance = field.closest('.tmt-form-acceptance');

    field.classList.toggle('tmt-field-error', invalid);
    field.setAttribute('aria-invalid', invalid ? 'true' : 'false');

    if (row) {
      row.classList.toggle('tmt-field-error-row', invalid);
    }

    if (acceptance) {
      acceptance.classList.toggle('tmt-field-error', invalid);
    }
  }

  function validateRequiredFields() {
    const fields = Array.from(form.querySelectorAll('input, textarea, select'))
      .filter(isRequiredField);

    const invalidFields = [];

    fields.forEach((field) => {
      const invalid = isInvalidRequiredField(field);
      setFieldError(field, invalid);
      if (invalid) invalidFields.push(field);
    });

    return invalidFields;
  }

  function clearFieldErrors() {
    form.classList.remove('tmt-form-was-submitted');

    form.querySelectorAll('.tmt-field-error').forEach((el) => {
      el.classList.remove('tmt-field-error');
    });

    form.querySelectorAll('.tmt-field-error-row').forEach((el) => {
      el.classList.remove('tmt-field-error-row');
    });

    form.querySelectorAll('[aria-invalid="true"]').forEach((el) => {
      el.setAttribute('aria-invalid', 'false');
    });
  }

  form.addEventListener('input', function (e) {
    if (!form.classList.contains('tmt-form-was-submitted')) return;
    if (e.target && e.target.matches('input, textarea, select')) {
      setFieldError(e.target, isInvalidRequiredField(e.target));
    }
  });

  form.addEventListener('change', function (e) {
    if (!form.classList.contains('tmt-form-was-submitted')) return;
    if (e.target && e.target.matches('input, textarea, select')) {
      setFieldError(e.target, isInvalidRequiredField(e.target));
    }
  });

  // AJAX submit handler
  form.addEventListener('submit', async function (e) {
    e.preventDefault();

    hideMessage();
    form.classList.add('tmt-form-was-submitted');

    const invalidFields = validateRequiredFields();
    if (invalidFields.length) {
      showMessage(M.required, true);
      invalidFields[0].focus({ preventScroll: false });
      setBusy(false);
      return;
    }

    setBusy(true);

    // Compute endpoint from form.action
    let endpoint;
    try {
      const u = new URL(form.action || '/api/submit.php', normOrigin);
      endpoint = u.toString();
    } catch (err) {
      endpoint = normOrigin.replace(/\/+$/, '') + '/api/submit.php';
    }

    try {
      const fd = new FormData(form);

      if (!fd.get('lang')) {
        fd.set('lang', pageLang);
      }

      const res = await fetch(endpoint, {
        method: 'POST',
        headers: { 'Accept': 'application/json' },
        body: fd,
        credentials: 'same-origin',
        redirect: 'follow'
      });

      const ctype = res.headers.get('content-type') || '';
      let data;

      if (ctype.includes('application/json')) {
        data = await res.json();
      } else {
        const text = await res.text();
        data = {
          ok: res.ok,
          message: text || (res.ok ? 'OK' : 'Error')
        };
      }

      if (!res.ok || !data.ok) {
        const msg = (data && (data.error || data.message)) || 'Error';
        showMessage(msg, true);
        validateRequiredFields();
      } else {
        showMessage(data.message || M.thanks, false);
        form.reset();
        clearFieldErrors();

        if (formTime) {
          formTime.value = String(Math.floor(performance.now() + Date.now()));
        }

        if (langInput) {
          langInput.value = pageLang;
        }
      }
    } catch (err) {
      showMessage(M.neterr, true);
    } finally {
      setBusy(false);
    }
  });

  // Initial UI state
  setBusy(false);
  clearFieldErrors();
  hideMessage();
});
/* ===========================================================
   TMT contact submit button no underline
   =========================================================== */

#contact .tmt-form-submit,
#contact .tmt-form-submit:hover,
#contact .tmt-form-submit:focus-visible,
#contact .tmt-contact-form button[type="submit"],
#contact .tmt-contact-form button[type="submit"]:hover,
#contact .tmt-contact-form button[type="submit"]:focus-visible,
#contact .tmt-contact-form input[type="submit"],
#contact .tmt-contact-form input[type="submit"]:hover,
#contact .tmt-contact-form input[type="submit"]:focus-visible{
  text-decoration:none !important;
}