/* =========================================================
   Chula Beauty Salon
   EmailMeForm Custom CSS Theme - Clean Version
   Sin barra superior / estilo más elegante y liviano
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Oswald:wght@500;600;700&display=swap');

body,
#emf-container-wrap {
  background: transparent !important;
  font-family: 'Montserrat', Arial, sans-serif !important;
  color: #2b1a14 !important;
}

/* ---------- Form container ---------- */
#emf-container-outer {
  width: 100% !important;
  max-width: 760px !important;
  margin: 36px auto !important;
  padding: 0 16px !important;
  box-sizing: border-box !important;
}

#emf-container {
  background: transparent !important;
  border: 0 !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 42px rgba(75, 38, 24, .18) !important;
  overflow: hidden !important;
  max-width: 720px !important;
  margin: 0 auto !important;
}

/* ---------- Hide top logo/header bar ---------- */
#emf-container #emf-logo {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
}

/* ---------- Form spacing ---------- */
#emf-form,
#emf-form ul {
  padding: 0 !important;
  margin: 0 !important;
}

#emf-form ul li,
#emf-container .emf-head-widget {
  padding-left: 46px !important;
  padding-right: 46px !important;
  box-sizing: border-box !important;
}

#emf-container .emf-head-widget {
  padding-top: 46px !important;
  padding-bottom: 18px !important;
  border-bottom: none !important;
}

/* ---------- Title and description ---------- */
#emf-container #emf-form-title {
  font-family: 'Oswald', Impact, sans-serif !important;
  font-size: 38px !important;
  line-height: 1.05 !important;
  letter-spacing: .7px !important;
  text-transform: uppercase !important;
  color: #ff6b55 !important;
  font-weight: 700 !important;
  margin: 0 0 12px 0 !important;
}

#emf-container #emf-form-description {
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  color: #3d281f !important;
  margin-top: 8px !important;
  max-width: 620px !important;
}

/* ---------- Field blocks: no automatic separators ---------- */
#emf-container li.emf-li-field,
#emf-container li.emf-field-section_break {
  list-style: none !important;
  padding-top: 18px !important;
  padding-bottom: 18px !important;
  background: transparent !important;
  border-bottom: none !important;
}

/* ---------- Labels ---------- */
#emf-container label.emf-label-desc,
#emf-container li .emf-div-field label {
  font-family: 'Oswald', Impact, sans-serif !important;
  font-size: 17px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  color: #ff6b55 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  font-style: normal !important;
}

#emf-container li .emf-div-instruction {
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-size: 12px !important;
  color: #6f4a3a !important;
  font-style: normal !important;
  margin-top: 6px !important;
}

/* ---------- Inputs, textareas and selects ---------- */
#emf-container div.emf-div-field input[type='text'],
#emf-container div.emf-div-field input[type='email'],
#emf-container div.emf-div-field input[type='number'],
#emf-container div.emf-div-field input[type='tel'],
#emf-container div.emf-div-field input[type='url'],
#emf-container div.emf-div-field textarea,
#emf-container div.emf-div-field select {
  background: #ffffff !important;
  border: 1.5px solid #f2b8a5 !important;
  border-radius: 14px !important;
  color: #2b1a14 !important;
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-size: 15px !important;
  font-style: normal !important;
  padding: 13px 15px !important;
  min-height: 46px !important;
  box-sizing: border-box !important;
  box-shadow: 0 5px 14px rgba(75, 38, 24, .06) !important;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
}

#emf-container div.emf-div-field input:focus,
#emf-container div.emf-div-field textarea:focus,
#emf-container div.emf-div-field select:focus {
  border-color: #ff6b55 !important;
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(255,107,85,.16) !important;
  background: #ffffff !important;
}

/* ---------- Checkbox / radio styling ---------- */
#emf-container input[type='checkbox'],
#emf-container input[type='radio'] {
  accent-color: #ff6b55 !important;
  transform: scale(1.08);
  margin-right: 7px !important;
}

#emf-container .one_column {
  margin: 7px 0 !important;
}

/* ---------- Manual separators only ---------- */
#emf-container li .emf-section-separator {
  border-bottom: 1px solid rgba(255,107,85,.28) !important;
}

/* ---------- Section titles ---------- */
#emf-container li.emf-field-section_break div.emf-div-field-section h3 {
  font-family: 'Oswald', Impact, sans-serif !important;
  font-size: 27px !important;
  line-height: 1.08 !important;
  text-transform: uppercase !important;
  color: #ff6b55 !important;
  font-weight: 700 !important;
  margin: 0 0 8px 0 !important;
  letter-spacing: .05em !important;
}

#emf-container li.emf-field-section_break .emf-section-text {
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: #3d281f !important;
}

/* ---------- Images ---------- */
#emf-container img {
  max-width: 100% !important;
  height: auto !important;
}

#emf-container .emf-div-field img,
#emf-container li img {
  border-radius: 16px !important;
}

/* ---------- Submit / buttons ---------- */
#emf-container #submit_form,
#emf-container .emf-action-next,
#emf-container .emf-action-previous,
#emf-container input[type='submit'],
#emf-container button {
  background: #000000 !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  font-family: 'Oswald', Impact, sans-serif !important;
  font-size: 23px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .7px !important;
  padding: 16px 38px !important;
  cursor: pointer !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.18) !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}

#emf-container #submit_form:hover,
#emf-container .emf-action-next:hover,
#emf-container .emf-action-previous:hover,
#emf-container input[type='submit']:hover,
#emf-container button:hover {
  background: #ff6b55 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 30px rgba(255,107,85,.28) !important;
}

#emf-container .emf-action-buttons,
#emf-container .emf-form-submit,
#emf-container li:last-child {
  text-align: center !important;
}

/* ---------- Error messages ---------- */
#emf-container .emf-error-message {
  margin: 18px 46px !important;
  padding: 14px 16px !important;
  border: 1px solid #ff6b55 !important;
  background: rgba(255,107,85,.10) !important;
  color: #2b1a14 !important;
  font-family: 'Montserrat', Arial, sans-serif !important;
  border-radius: 14px !important;
}

#emf-container-outer #emf-form-shadows {
  display: none !important;
  visibility: hidden !important;
}

/* ---------- Mobile ---------- */
@media (max-width: 640px) {
  #emf-container-outer {
    margin: 14px auto !important;
    padding: 0 10px !important;
  }

  #emf-container {
    border-radius: 18px !important;
  }

  #emf-form ul li,
  #emf-container .emf-head-widget {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  #emf-container .emf-head-widget {
    padding-top: 30px !important;
  }

  #emf-container #emf-form-title {
    font-size: 31px !important;
  }

  #emf-container #submit_form,
  #emf-container input[type='submit'],
  #emf-container button {
    width: auto !important;
    max-width: 100% !important;
    font-size: 21px !important;
  }
}