/* ================================================================
   Advertisement plugin component CSS — v1.2.13
   Only advertisement-specific presentation lives here. Common form
   visual rules (validation, consent, confirmation and actions) are owned
   by the active theme's assets/css/form-ui.css.
   ================================================================ */

.tsg-advertise-form {
  width: 100%;
  max-width: 1200px;
}

/* ----------------------------------------------------------------
   Shared card / step-label treatment mirrored from request form
   ---------------------------------------------------------------- */
.tsg-advertise-form .tsg-request-box {
  border-radius: var(--tsk-r-xl, 24px);
}

.tsg-advertise-form .tsg-request-step-label {
  margin: 0 0 6px;
  font-family: var(--tsk-font-mono, ui-monospace, monospace);
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--tsk-primary-700, #0b5a55);
  font-weight: 700;
}

.tsg-advertise-form .tsg-advertise-complete,
.tsg-advertise-form .tsg-advertise-confirm {
  margin-top: 0;
}

.tsg-advertise-form .tsg-form-intro {
  margin: -4px 0 22px;
  color: var(--tsk-ink-600, #556262);
  font-size: 14px;
  line-height: 1.8;
}

.tsg-advertise-form .tsg-request-complete-lead,
.tsg-advertise-form .tsg-advertise-complete-lead {
  font-size: 15px;
}

/* Long textarea content on confirmation screen must remain readable. */
.tsg-advertise-form .tsg-advertise-confirm .tsg-definition-list dd {
  white-space: normal;
  overflow-wrap: anywhere;
}


/* Input length guidance uses the same max_length value as validation. */
.tsg-advertise-form .tsg-advertise-input-form > label {
  column-gap: 24px;
  row-gap: 5px;
}

.tsg-advertise-form .tsg-advertise-field-limit {
  display: block;
  grid-column: 2;
  justify-self: end;
  margin-top: 0;
  color: var(--tsk-ink-500, #6E7B7B);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  text-align: right;
}

@media (max-width: 640px) {
  .tsg-advertise-form .tsg-advertise-input-form > label {
    row-gap: 5px;
  }

  .tsg-advertise-form .tsg-advertise-field-limit {
    grid-column: 1;
    justify-self: end;
  }
}

/* Cloudflare Turnstile (shown only when enabled in settings). */
.tsg-turnstile-wrap{margin:18px auto 6px;display:flex;flex-direction:column;align-items:center;text-align:center}.tsg-turnstile-wrap .cf-turnstile{margin:0 auto}.tsg-turnstile-note{margin:7px 0 0;font-size:.875em;text-align:center}
