@charset "UTF-8";

/* =========================
   WPForms Custom Styling
========================== */

form.wpforms-form div.wpforms-field input::placeholder,
form.wpforms-form div.wpforms-field textarea::placeholder {
  color: var(--theme-color-900);
  font-family: var(--font-base);
  font-size: var(--font-size-base);
}

form.wpforms-form ::selection {
  background-color: var(--theme-color-600);
  color: var(--theme-color-100);
}

/* Form Container */
form.wpforms-form {
  font-family: var(--font-base);
  font-size: var(--font-size-base);
  color: var(--theme-color-900);
  
}

/* Fields */
form.wpforms-form div.wpforms-field {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--space-2);
}

/* Labels */
form.wpforms-form div.wpforms-field label.wpforms-field-label {
  font-size: var(--font-size-sm);
  margin-bottom: var(--space-1);
  color: var(--theme-color-900);
font-weight: normal;
}

/* Inputs, Textareas, Selects */
form.wpforms-form div.wpforms-field input,
form.wpforms-form div.wpforms-field textarea,
form.wpforms-form div.wpforms-field select {
  font-family: var(--font-base);
  font-size: var(--font-size-base);
  padding: var(--space-1);
  border: 1px solid var(--theme-color-900);
  border-radius: var(--border-radius);
  background-color: var(--theme-color-300);
  color: var(--theme-color-900);
  transition: all 0.25s ease-in-out;
}


form.wpforms-form div.wpforms-field textarea {
  width: 100%;
  height: 8rem;
  box-sizing: border-box;
}

@media (min-width: 40em) {
  form.wpforms-form div.wpforms-field textarea {
    width: 80%;
  }
}

/* Focus */
form.wpforms-form div.wpforms-field input:focus,
form.wpforms-form div.wpforms-field textarea:focus,
form.wpforms-form div.wpforms-field select:focus {
  outline: none;
  border-color: var(--theme-color-600);
  box-shadow: 0 0 0 3px hsla(200, 80%, 50%, 0.2);
}

/* WPForms Submit Button – identisch zur .button Klasse */
form.wpforms-form div.wpforms-submit-container input[type="submit"],
form.wpforms-form div.wpforms-submit-container button {
  min-width: 240px;
  min-height: 44px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;

  font-family: var(--font-heading);
  font-size: var(--font-size-base);
  line-height: 1;

  padding-block: 0.75em;
  padding-inline: 1em;

  cursor: pointer;
  border: 1px solid transparent;
  border-radius: var(--border-radius);
  text-decoration: none;

  background-color: var(--theme-color-900);
  color: var(--theme-color-100);

}

/* Hover & Focus */
form.wpforms-form div.wpforms-submit-container input[type="submit"]:hover,
form.wpforms-form div.wpforms-submit-container input[type="submit"]:focus,
form.wpforms-form div.wpforms-submit-container button:hover,
form.wpforms-form div.wpforms-submit-container button:focus {
  background-color: var(--theme-color-600);
    color: var(--theme-color-900);
  outline: none;
}

/* Error Messages */
form.wpforms-form .wpforms-error,
form.wpforms-form .wpforms-error .wpforms-field-required {
  color: #c62828;
  font-weight: bold;
}

/* Success / Confirmation */
form.wpforms-form .wpforms-confirmation {
  color: #2e7d32;
  font-weight: bold;
}

@media (prefers-reduced-motion: no-preference) {

    form.wpforms-form div.wpforms-submit-container input[type="submit"],
form.wpforms-form div.wpforms-submit-container button {

  transition: background-color .2s ease-in-out, transform .2s ease-in-out;
}

/* Hover & Focus */
form.wpforms-form div.wpforms-submit-container input[type="submit"]:hover,
form.wpforms-form div.wpforms-submit-container input[type="submit"]:focus,
form.wpforms-form div.wpforms-submit-container button:hover,
form.wpforms-form div.wpforms-submit-container button:focus {
  transform: translateY(-4px);
  outline: none;
}

}

@media (prefers-contrast: more) {
    
}
