/**
 * TBS design-system HubSpot embed overrides.
 * Relies on CSS vars set by theme.js applyDsBrandCssVars (--ds-form-*).
 * Keep in sync with ContactPage.jsx (wrapper .ds-hubspot-form-wrap, cssClass tbs-ds-hubspot).
 */

/* HubSpot embedded form - override portal defaults (orange button, low-contrast labels) */
.ds-hubspot-form-wrap .hs-form,
.ds-hubspot-form-wrap .hs-form label,
.ds-hubspot-form-wrap form.hs-form,
form.hs-form.tbs-ds-hubspot {
  font-family: 'Rethink Sans', system-ui, sans-serif !important;
}
.ds-hubspot-form-wrap .hs-form-field {
  margin-bottom: 1.25rem !important;
}
.ds-hubspot-form-wrap .hs-form-field label,
.ds-hubspot-form-wrap .hs-form-field > label span,
.ds-hubspot-form-wrap label.hs-form-required span:first-child,
form.hs-form.tbs-ds-hubspot label span,
form.hs-form.tbs-ds-hubspot label {
  color: var(--ds-form-label, rgba(252, 252, 252, 0.97)) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
}
.ds-hubspot-form-wrap .hs-field-desc {
  color: var(--ds-form-muted, rgba(252, 252, 252, 0.52)) !important;
  font-size: 1rem !important;
}
.ds-hubspot-form-wrap .hs-input,
.ds-hubspot-form-wrap textarea.hs-input,
.ds-hubspot-form-wrap select.hs-input,
form.hs-form.tbs-ds-hubspot .hs-input {
  background-color: var(--ds-form-input-bg, rgba(252, 252, 252, 0.08)) !important;
  border: 1px solid var(--ds-form-border, rgba(252, 252, 252, 0.1)) !important;
  border-radius: 2px !important;
  color: var(--ds-form-input-fg, #fcfcfc) !important;
  font-family: 'Rethink Sans', system-ui, sans-serif !important;
  font-size: 1rem !important;
  line-height: 1.45 !important;
  padding: 0.75rem 0.9rem !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
.ds-hubspot-form-wrap .hs-input::placeholder,
.ds-hubspot-form-wrap textarea.hs-input::placeholder {
  color: var(--ds-form-placeholder, rgba(252, 252, 252, 0.45)) !important;
}
.ds-hubspot-form-wrap .hs-input:focus,
.ds-hubspot-form-wrap textarea.hs-input:focus,
.ds-hubspot-form-wrap select.hs-input:focus {
  outline: none !important;
  border-color: var(--ds-form-border-focus, rgba(213, 110, 237, 0.65)) !important;
  box-shadow: 0 0 0 3px rgba(97, 189, 186, 0.22) !important;
}
.ds-hubspot-form-wrap .hs-button,
.ds-hubspot-form-wrap input[type='submit'].hs-button,
.ds-hubspot-form-wrap .hs-submit .hs-button,
form.hs-form.tbs-ds-hubspot input[type='submit'],
form.hs-form.tbs-ds-hubspot .hs-button {
  background: var(--ds-form-accent, #d56eed) !important;
  border: 1px solid var(--ds-form-accent, #d56eed) !important;
  border-radius: 2px !important;
  color: var(--ds-form-accent-text, #02022b) !important;
  cursor: pointer !important;
  font-family: 'Rethink Sans', system-ui, sans-serif !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  padding: 0.8rem 1.75rem !important;
  min-height: 44px !important;
  transition: filter 0.15s ease, transform 0.12s ease !important;
}
.ds-hubspot-form-wrap .hs-button:hover {
  filter: brightness(1.06);
}
.ds-hubspot-form-wrap .legal-consent-container,
.ds-hubspot-form-wrap .hs-richtext {
  color: var(--ds-form-muted, rgba(252, 252, 252, 0.52)) !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
}
.ds-hubspot-form-wrap .legal-consent-container a,
.ds-hubspot-form-wrap .hs-richtext a {
  color: var(--ds-focus, #61bdba) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}
.ds-hubspot-form-wrap .hs-form-required .hs-input.invalid.error {
  border-color: rgba(237, 100, 100, 0.85) !important;
}
.ds-hubspot-form-wrap .hs-error-msgs li {
  color: rgba(237, 180, 180, 0.98) !important;
  font-size: 1rem !important;
}

@media (max-width: 480px) {
  .ds-hubspot-form-wrap .hs-input:not([type='checkbox']):not([type='radio']),
  .ds-hubspot-form-wrap textarea.hs-input,
  .ds-hubspot-form-wrap select.hs-input {
    min-height: 44px !important;
  }
}