/*
 * HubSpot developer-embed form — shared compact theme (Q-6579).
 *
 * One stylesheet for every page that embeds a HubSpot form with the developer
 * embed (`<div class="hs-form-html" data-form-id=… data-portal-id=…>`), e.g. the
 * Downloads pages (P2P-Prozessskizze, KI in der Finanzabteilung). Visual target
 * is the /de/kontakt form: 13px labels, light inputs, legal/privacy copy as
 * small as allowed. Include it per page via head_raw:
 *   <link href="/styles/hubspot-form.css" rel="stylesheet" type="text/css"/>
 *
 * The HubSpot renderer reads `--hsf-<part>__<prop>` before its own
 * `--hsf-default-*` values, so overriding the public variables on the wrapper is
 * enough; the few plain rules below cover what the variables do not expose.
 */
.hs-form-html {
  --hsf-global__font-family: "Inter Variablefont", Inter, Arial, sans-serif;
  --hsf-global__color: #001820;

  --hsf-row__vertical-spacing: 0.875rem;
  --hsf-row__horizontal-spacing: 0.875rem;
  --hsf-module__vertical-spacing: 0.875rem;

  --hsf-field-label__font-size: 13px;
  --hsf-field-label__color: #001820;

  --hsf-field-input__font-size: 14px;
  --hsf-field-input__color: #33475b;
  --hsf-field-input__background-color: #f5f8fa;
  --hsf-field-input__border-color: #cbd6e2;
  --hsf-field-input__border-width: 1px;
  --hsf-field-input__border-style: solid;
  --hsf-field-input__border-radius: 10px;
  --hsf-field-input__padding: 0 12px;
  --hsf-field-input__placeholder-color: #9aa8b5;
  --hsf-field-dropdown-options__border-radius: 10px;

  --hsf-field-textarea__font-size: 14px;
  --hsf-field-textarea__background-color: #f5f8fa;
  --hsf-field-textarea__border-color: #cbd6e2;
  --hsf-field-textarea__border-radius: 10px;
  --hsf-field-textarea__padding: 8px 12px;

  --hsf-field-description__font-size: 12px;
  --hsf-field-footer__font-size: 11px;
  --hsf-erroralert__font-size: 12px;
  --hsf-infoalert__font-size: 12px;

  --hsf-richtext__font-size: 11px;
  --hsf-richtext__color: #5b6b78;

  --hsf-button__font-size: 15px;
  --hsf-button__font-weight: 600;
  --hsf-button__color: #001820;
  --hsf-button__background-color: #12cea1;
  --hsf-button--hover__background-color: #10b98f;
  --hsf-button__border-radius: 999px;
  --hsf-button__padding: 10px 24px;
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-FieldLabel {
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 4px;
}

/* Text inputs and the custom dropdown share one compact 40px control. */
.hs-form-html [data-hsfc-id="Renderer"] .hsfc-TextInput {
  height: 40px;
  min-height: 40px;
  line-height: 1.4;
  box-shadow: none;
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-TextInput:focus {
  border-color: #12cea1;
  outline: none;
  box-shadow: 0 0 0 3px rgba(18, 206, 161, 0.18);
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-DropdownInput__Caret {
  padding: 0 12px;
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-DropdownInput__Caret svg,
.hs-form-html [data-hsfc-id="Renderer"] .hsfc-DropdownInput__Caret > * {
  width: 10px;
  height: auto;
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-DropdownOptions {
  font-size: 14px;
}

/* Privacy / consent copy: as small as legally readable. */
.hs-form-html [data-hsfc-id="Renderer"] .hsfc-RichText,
.hs-form-html [data-hsfc-id="Renderer"] .hsfc-RichText p,
.hs-form-html [data-hsfc-id="Renderer"] .hsfc-DataPrivacyField,
.hs-form-html [data-hsfc-id="Renderer"] .hsfc-DataPrivacyField p {
  font-size: 11px;
  line-height: 1.5;
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-RichText p + p,
.hs-form-html [data-hsfc-id="Renderer"] .hsfc-DataPrivacyField > * + * {
  margin-top: 6px;
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-RichText a {
  color: inherit;
  text-decoration: underline;
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-NavigationRow {
  margin-top: 0.5rem;
}

.hs-form-html [data-hsfc-id="Renderer"] .hsfc-Button {
  line-height: 1.4;
}