/* ==========================================================================
   CornerHuolto — Gravity Forms tyylit
   Sovittaa Gravity Formsin 100% CornerHuollon lomakekortin ilmeeseen.
   ========================================================================== */

.cornerhuolto .gform_wrapper {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

.cornerhuolto .gform_wrapper form {
  width: 100% !important;
}

/* Piilotetaan Gravity Formsin ylimääräinen otsikko ja kuvaus */
.cornerhuolto .gform_wrapper .gform_heading,
.cornerhuolto .gform_wrapper .gform_title,
.cornerhuolto .gform_wrapper .gform_description {
  display: none !important;
}

/* Lomakekenttien ruudukko */
.cornerhuolto .gform_wrapper .gform_fields {
  display: grid !important;
  grid-template-columns: repeat(12, 1fr) !important;
  column-gap: 20px !important;
  row-gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.cornerhuolto .gform_wrapper .gfield {
  margin: 0 !important;
  padding: 0 !important;
  grid-column: span 12 !important;
}

/* Ensimmäinen rivi: NIMI ja PUHELIN 6 saraketta kumpikin, 20px tyhjää alle */
.cornerhuolto .gform_wrapper #field_1_1,
.cornerhuolto .gform_wrapper #field_1_3 {
  grid-column: span 6 !important;
  margin-bottom: 20px !important;
}

@media (max-width: 640px) {
  .cornerhuolto .gform_wrapper #field_1_1,
  .cornerhuolto .gform_wrapper #field_1_3 {
    grid-column: span 12 !important;
    margin-bottom: 16px !important;
  }
}

/* Toinen rivi: SÄHKÖPOSTI, 22px tyhjää alle */
.cornerhuolto .gform_wrapper #field_1_2 {
  grid-column: span 12 !important;
  margin-bottom: 22px !important;
}

/* Kolmas rivi: VIESTI */
.cornerhuolto .gform_wrapper #field_1_4 {
  grid-column: span 12 !important;
  margin-bottom: 0 !important;
}

/* Cloudflare Turnstile / piilokentät */
.cornerhuolto .gform_wrapper #field_1_5,
.cornerhuolto .gform_wrapper #field_1_6,
.cornerhuolto .gform_wrapper .gfield_html {
  grid-column: span 12 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Selitteet (Labels): pienet uppercase-labelit letter-spacingilla */
.cornerhuolto .gform_wrapper .gfield_label {
  display: block !important;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #0f141e !important;
  margin-bottom: 7px !important;
  line-height: 1.2 !important;
}

/* Poistetaan required-asteriskit kokonaan näkyvistä */
.cornerhuolto .gform_wrapper .gfield_required,
.cornerhuolto .gform_wrapper .gfield_required_text,
.cornerhuolto .gform_wrapper .gfield_required_asterisk {
  display: none !important;
}

/* Syötekentät: korkeus 38–40px, tausta #FAFAF8, reunus #E0E0DA */
.cornerhuolto .gform_wrapper input[type="text"],
.cornerhuolto .gform_wrapper input[type="tel"],
.cornerhuolto .gform_wrapper input[type="email"] {
  width: 100% !important;
  height: 39px !important;
  padding: 8px 14px !important;
  background-color: #FAFAF8 !important;
  border: 1px solid #E0E0DA !important;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 0.92rem !important;
  color: #0f141e !important;
  border-radius: 0px !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease !important;
  line-height: 1.5 !important;
}

/* Textarea: korkeus 133–135px, tausta #FAFAF8, reunus #E0E0DA */
.cornerhuolto .gform_wrapper textarea {
  width: 100% !important;
  height: 134px !important;
  min-height: 134px !important;
  padding: 10px 14px !important;
  background-color: #FAFAF8 !important;
  border: 1px solid #E0E0DA !important;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 0.92rem !important;
  color: #0f141e !important;
  border-radius: 0px !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease !important;
  line-height: 1.5 !important;
  resize: vertical !important;
}

.cornerhuolto .gform_wrapper input:focus,
.cornerhuolto .gform_wrapper textarea:focus {
  outline: none !important;
  background-color: #FAFAF8 !important;
  border-color: #009fe3 !important;
}

/* Lähetyspainike: 30px väliä textarean jälkeen */
.cornerhuolto .gform_wrapper .gform_footer,
.cornerhuolto .gform_wrapper .gform_page_footer {
  margin-top: 30px !important;
  padding: 0 !important;
  width: 100% !important;
}

.cornerhuolto .gform_button,
.cornerhuolto .gform_wrapper input[type="submit"],
.cornerhuolto .gform_wrapper button[type="submit"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 14px 28px !important;
  background-color: #009fe3 !important;
  color: #ffffff !important;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  border: 1px solid transparent !important;
  border-radius: 0px !important;
  text-transform: none !important;
  letter-spacing: -0.01em !important;
  cursor: pointer !important;
  transition: background-color 0.15s ease !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
}

.cornerhuolto .gform_button:hover,
.cornerhuolto .gform_wrapper input[type="submit"]:hover,
.cornerhuolto .gform_wrapper button[type="submit"]:hover {
  background-color: #0087c2 !important;
  border-color: transparent !important;
  color: #ffffff !important;
}
