/* Adapt the native embed to the existing pill form; leave section design alone. */
.bera-newsletter .klaviyo-form-Y6Vqtf {
  min-height: 55px;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] [data-testid="form-row"]:has(input[type="email"]) {
  align-items: center !important;
  flex-wrap: nowrap !important;
  background: #fff !important;
  border-radius: 500px !important;
  padding: 6px !important;
  gap: 0 !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] [data-testid="form-component"] {
  min-width: 0 !important;
  padding: 0 !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] [data-testid="form-component"]:has(input[type="email"]) {
  flex: 1 1 0% !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] [data-testid="form-component"]:has(button) {
  flex: 0 0 auto !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] input,
body form[data-testid="klaviyo-form-Y6Vqtf"] button,
body form[data-testid="klaviyo-form-YhjkfB"] input,
body form[data-testid="klaviyo-form-YhjkfB"] button,
body form[data-testid="klaviyo-form-Y6Vqtf"] p,
body form[data-testid="klaviyo-form-YhjkfB"] p {
  font-family: "Jost", Arial, sans-serif !important;
  letter-spacing: 0 !important;
}

body form[data-testid="klaviyo-form-YhjkfB"] input {
  font-size: 16px !important;
  min-width: 0 !important;
  border-radius: 6px !important;
  background: #fff !important;
  border-color: var(--bera-color-line) !important;
}

body form[data-testid="klaviyo-form-YhjkfB"] button {
  min-height: 48px;
  font-size: 16px !important;
  line-height: 1.4 !important;
  white-space: normal !important;
}

body form[data-testid="klaviyo-form-YhjkfB"] h2 {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] input[type="email"] {
  width: 100% !important;
  min-width: 0 !important;
  height: 43px !important;
  box-sizing: border-box !important;
  padding: 6px 12px 6px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 15px !important;
  color: #1a1c18 !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] input[type="email"]::placeholder {
  color: rgba(26, 28, 24, 0.4) !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] button {
  box-sizing: border-box !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 12px 20px !important;
  border: 0 !important;
  border-radius: 500px !important;
  background: #0b2615 !important;
  color: #fff !important;
  font-size: var(--sp-btn-size, 16px) !important;
  font-weight: var(--sp-btn-weight, 600) !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] button:hover {
  background: #253c1c !important;
}

/* Anchor validation to the whole pill and reserve room inside the section. */
body form[data-testid="klaviyo-form-Y6Vqtf"]:has(input[aria-invalid="true"]) {
  padding-bottom: 64px !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] [data-testid="form-component"]:has(input),
body form[data-testid="klaviyo-form-Y6Vqtf"] .klaviyo-emailinput,
body form[data-testid="klaviyo-form-Y6Vqtf"] .klaviyo-emailinput > div:has([role="alert"]) {
  position: static !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] .klaviyo-emailinput > div > div:has([role="alert"]) {
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
}

body form[data-testid="klaviyo-form-Y6Vqtf"] .klaviyo-emailinput [role="alert"] {
  display: block !important;
  white-space: normal !important;
  line-height: 1.4 !important;
}

body form[data-testid="klaviyo-form-YhjkfB"] a {
  color: var(--bera-color-forest) !important;
}

/* Keep Klaviyo's fixed-width popup from scaling down text and touch targets. */
body [role="dialog"][aria-label="Join the Bera newsletter"] {
  padding: 16px !important;
  box-sizing: border-box !important;
}

body [role="dialog"][aria-label="Join the Bera newsletter"] > div {
  transform: none !important;
  margin: auto !important;
  width: 100% !important;
  max-width: 520px !important;
  max-height: none !important;
}

body form[data-testid="klaviyo-form-YhjkfB"] {
  width: 100% !important;
  min-width: 0 !important;
}

body form[data-testid="klaviyo-form-YhjkfB"] [data-testid="form-component"] {
  min-width: 0 !important;
}

@media (max-width: 749px) {
  body form[data-testid="klaviyo-form-Y6Vqtf"] input[type="email"] {
    font-size: 16px !important;
  }
  body form[data-testid="klaviyo-form-YhjkfB"] {
    padding: 20px 16px !important;
  }
  body form[data-testid="klaviyo-form-YhjkfB"] [data-testid="form-component"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  body form[data-testid="klaviyo-form-YhjkfB"] h2 {
    font-size: 30px !important;
  }
}
