/* The donation form (2026-10-30, Alina's design "Donate, make a donation"): a cream card on the lilac gradient,
   step 1 how much, step 2 the details; the card itself is entered on Stripe's page. The membership form uses the
   same card; both are the split one (photo on the left, 2026-10-31), see "the split card" at the end.
   Loaded by the womafreesm_pay module (variants "donate" and "membership") only on the pages that have them. */

.wf-donate {
  position: relative;
  padding: 48px 24px 120px;
  color: #221a1f;
}

/* the lilac gradient runs from the top of the page, under the fixed header and the crumbs, down to the footer:
   it is drawn behind the section and reaches up by the section's own offset (set by the script; 152px is the
   desktop crumbs bar). The page's cream stays on html; body and the crumbs bar let the gradient through. */
body:has(.wf-donate),
body:has(.wf-donate) .site-breadcrumbs {
  background: transparent;
}

/* #app is at least a screen tall: on a tall screen the section grows to the footer, so the gradient does too */
#app:has(> .wf-donate) {
  display: flex;
  flex-direction: column;
}

#app > .wf-donate {
  flex: 1 0 auto;
}

.wf-donate::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: calc(-1 * var(--wf-donate-up, 152px));
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(125deg, #9e5e99 0%, #d7b9d3 13%, #f2e7ea 25%, #fcfaf1 38%, #fcfaf1 60%, #efe2ec 72%, #cfa6ca 87%, #9e5e99 100%);
  pointer-events: none;
}

.wf-donate__inner {
  width: min(100%, 1036px);
  margin: 0 auto;
}

.wf-donate__head {
  text-align: center;
}

.wf-donate__title {
  margin: 0;
  font-family: Lora, Georgia, "Times New Roman", serif;
  font-size: 50px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.03em;
  color: #462143;
}

.wf-donate__lead {
  margin: 20px 0 0;
  font-size: 20px;
  line-height: 1.4;
  color: #656667;
}

.wf-donate__card {
  position: relative;
  margin-top: 96px;
  padding: 56px;
  border-radius: 16px;
  background: #fcfaf1;
  /* a step change brings the card back under the fixed header, not behind it */
  scroll-margin-top: 120px;
}

.wf-donate__trap {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}

/* with the script, one step at a time; without it both show, one under the other */
.wf-donate.is-js .wf-donate__step:not(.is-active) {
  display: none;
}

.wf-donate:not(.is-js) .wf-donate__back,
.wf-donate:not(.is-js) .wf-donate__next,
.wf-donate:not(.is-js) [data-wf-donate-step="2"] .wf-donate__progress,
.wf-donate:not(.is-js) [data-wf-donate-step="2"] .wf-donate__heading {
  display: none;
}

/* ---- progress ---- */
.wf-donate__progress {
  width: min(100%, 826px);
  margin: 0 auto;
}

.wf-donate__bar {
  height: 8px;
  border-radius: 4px;
  background: #f2f1f0;
  overflow: hidden;
}

.wf-donate__bar span {
  display: block;
  height: 100%;
  border-radius: 4px;
  background: #984f91;
}

.wf-donate__pct {
  display: flex;
  justify-content: space-between;
  margin-top: 4px;
  font-size: 16px;
  line-height: 1.4;
  color: #984f91;
}

.wf-donate__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
  padding: 4px 0;
  border: 0;
  background: none;
  color: #221a1f;
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  line-height: 1.3;
  cursor: pointer;
}

.wf-donate__back:hover {
  color: #984f91;
}

.wf-donate__back:focus-visible {
  outline: 2px solid #984f91;
  outline-offset: 2px;
}

.wf-donate__heading {
  margin: 44px 0 0;
  font-family: Lora, Georgia, "Times New Roman", serif;
  font-size: 40px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  text-align: center;
  color: #221a1f;
}

.wf-donate__heading span {
  display: block;
}

/* ---- the fields column ---- */
.wf-donate__fields {
  width: min(100%, 402px);
  margin: 44px auto 0;
}

.wf-donate__group {
  min-width: 0;
  margin: 0 0 32px;
  padding: 0;
  border: 0;
}

.wf-donate__label {
  display: block;
  margin: 0 0 8px;
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  color: #221a1f;
}

.wf-donate__option {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 78px;
  margin: 0 0 10px;
  padding: 0 24px 0 32px;
  border-radius: 12px;
  background: #f2f1f0;
  font-family: Lora, Georgia, "Times New Roman", serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
  color: #221a1f;
  cursor: pointer;
  transition: background-color 160ms ease, box-shadow 160ms ease;
}

.wf-donate__option:last-child {
  margin-bottom: 0;
}

/* the membership form: a level's price under its name */
.wf-donate__option-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.wf-donate__option-price {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  line-height: 1.3;
  color: #656667;
}

.wf-donate__impact {
  margin-top: 32px;
}

.wf-donate__impact[hidden] {
  display: none;
}

.wf-donate__impact .wf-donate__group {
  margin-bottom: 32px;
}

/* the designer's small square marker; a choice of one, so it is a radio underneath */
.wf-donate__option input {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  margin: 0;
  border: 1px solid #984f91;
  border-radius: 2px;
  background: transparent;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.wf-donate__option input:checked {
  background: #984f91;
  box-shadow: inset 0 0 0 2px #f2f1f0;
}

.wf-donate__option:has(input:checked) {
  box-shadow: inset 0 0 0 1px #984f91;
}

.wf-donate__option:hover {
  background: #efe2ec;
}

.wf-donate__option:hover input:checked {
  box-shadow: inset 0 0 0 2px #efe2ec;
}

.wf-donate__option input:focus-visible {
  outline: 2px solid #984f91;
  outline-offset: 3px;
}

.wf-donate__field {
  display: block;
  margin: 0 0 24px;
  font-weight: 400;
}

.wf-donate__group .wf-donate__label {
  margin-bottom: 12px;
}

.wf-donate__field .wf-donate__label {
  margin-bottom: 4px;
}

.wf-donate__submit.wf-donate__next {
  margin-top: 44px;
}

.wf-donate__field--other {
  margin-top: -20px;
  margin-bottom: 0;
}

.wf-donate__input {
  position: relative;
  display: block;
}

.wf-donate__input svg {
  position: absolute;
  top: 50%;
  left: 16px;
  color: #221a1f;
  transform: translateY(-50%);
  pointer-events: none;
}

.wf-donate__input input {
  display: block;
  width: 100%;
  height: 36px;
  padding: 0 14px;
  border: 1px solid #656667;
  border-radius: 6px;
  background: #fcfaf1;
  color: #221a1f;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.4;
}

.wf-donate__input--icon input {
  padding-left: 40px;
}

.wf-donate__input input::placeholder {
  color: #aeaeb0;
  opacity: 1;
}

.wf-donate__input input:focus {
  outline: 2px solid #984f91;
  outline-offset: 1px;
  border-color: #984f91;
}

.wf-donate__hint {
  display: block;
  margin-top: 16px;
  font-size: 14px;
  line-height: 1.4;
  color: #656667;
}

.wf-donate__error {
  margin: 12px 0 0;
  font-size: 14px;
  line-height: 1.4;
  color: #b3261e;
}

.wf-donate__error + .wf-donate__check {
  margin-top: 32px;
}

.wf-donate__check {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 24px 0 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  color: #221a1f;
  cursor: pointer;
}

.wf-donate__check input {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  margin: 3px 0 0;
  accent-color: #984f91;
}

/* the membership form's second box ("updates" under "18 or older") sits close to the first */
.wf-donate__check.wf-donate__check--next {
  margin-top: 16px;
}

.wf-donate__check a,
.wf-donate__notes a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* the primary button of the library: Purple Action, 48px, r8, hover Purple, nothing moves */
.wf-donate__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  margin-top: 40px;
  padding: 0 24px;
  border: 1px solid #984f91;
  border-radius: 8px;
  background: #984f91;
  color: #fcfaf1;
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
  cursor: pointer;
  transition: background-color 160ms ease, border-color 160ms ease;
}

.wf-donate__submit:hover,
.wf-donate__submit:focus-visible {
  border-color: #5d295f;
  background: #5d295f;
}

.wf-donate__submit:focus-visible {
  outline: 2px solid #5d295f;
  outline-offset: 2px;
}

.wf-donate__submit:disabled {
  opacity: 0.6;
  cursor: wait;
}

.wf-donate__notes {
  margin-top: 32px;
}

.wf-donate__notes p {
  margin: 0 0 28px;
  font-size: 14px;
  line-height: 1.45;
  color: #656667;
}

.wf-donate__notes p:last-child {
  margin-bottom: 0;
}

/* ---- the thank-you screen (Alina's "Thank you for funding the system"): the site's 100px hero title, centred ---- */
.wf-donate--thanks {
  padding-top: 112px;
}

.wf-donate__thanks {
  text-align: center;
}

.wf-donate__thanks-title {
  max-width: 1240px;
  margin: 0 auto;
  font-family: Lora, Georgia, "Times New Roman", serif;
  font-size: 100px;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: #462143;
}

.wf-donate__thanks-amount,
.wf-donate__thanks-lead {
  max-width: 830px;
  margin: 24px auto 0;
  font-size: 24px;
  line-height: 1.3;
  color: #656667;
}

.wf-donate__thanks-lead {
  margin-top: 0;
}

.wf-donate__thanks-text {
  max-width: 580px;
  margin: 48px auto 0;
  font-size: 16px;
  line-height: 1.35;
  color: #656667;
}

.wf-donate__thanks-text + .wf-donate__thanks-text {
  margin-top: 20px;
}

.wf-donate__submit.wf-donate__thanks-button {
  display: inline-flex;
  width: auto;
  margin-top: 48px;
  text-decoration: none;
}

.wf-donate__thanks-legal {
  max-width: 580px;
  margin: 56px auto 0;
  font-size: 12px;
  line-height: 1.45;
  color: #656667;
}

@media (max-width: 600px) {
  .wf-donate--thanks {
    padding-top: 64px;
  }

  .wf-donate__thanks-title {
    font-size: 54px;
  }

  .wf-donate__thanks-amount,
  .wf-donate__thanks-lead {
    font-size: 18px;
  }

  .wf-donate__submit.wf-donate__thanks-button {
    width: 100%;
  }
}

@media (max-width: 600px) {
  .wf-donate {
    padding: 32px 24px 96px;
  }

  .wf-donate__title {
    font-size: 40px;
  }

  .wf-donate__lead {
    font-size: 16px;
  }

  .wf-donate__card {
    margin-top: 40px;
    padding: 32px 20px;
  }

  .wf-donate__heading {
    margin-top: 40px;
    font-size: 32px;
  }

  .wf-donate__fields {
    margin-top: 40px;
  }

  .wf-donate__option {
    min-height: 64px;
    padding-left: 24px;
    font-size: 22px;
  }
}

/* ---- the split card (the donation form, Alina's design of 2026-10-31): the photo with the page title on the left,
   the two steps on the right; at 900px and below the photo goes and the title stands over the form ---- */
.wf-donate--split {
  padding: 32px 24px 120px;
}

.wf-donate--split .wf-donate__inner {
  width: min(100%, 1248px);
}

.wf-donate--split .wf-donate__card {
  display: grid;
  grid-template-columns: minmax(0, 500fr) minmax(0, 596fr);
  column-gap: 64px;
  margin-top: 0;
  padding: 12px 76px 12px 12px;
  border-radius: 24px;
}

.wf-donate--split .wf-donate__panel {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 628px;
  padding: 48px;
  border-radius: 16px;
  overflow: hidden;
  background: #462143;
}

.wf-donate--split .wf-donate__photo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* the plum shade at the bottom of the photo, under the title */
.wf-donate--split .wf-donate__panel::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(70, 33, 67, 0) 45%, rgba(70, 33, 67, 0.55) 72%, rgba(70, 33, 67, 0.85) 100%);
}

.wf-donate--split .wf-donate__head {
  position: relative;
  z-index: 1;
  text-align: left;
}

.wf-donate--split .wf-donate__title {
  font-size: 47px;
  letter-spacing: -0.02em;
  color: #fcfaf1;
}

.wf-donate--split .wf-donate__lead {
  margin-top: 16px;
  font-size: 18px;
  color: #fcfaf1;
}

.wf-donate--split .wf-donate__body {
  min-width: 0;
  padding: 47px 0 48px;
}

.wf-donate--split .wf-donate__progress {
  width: 100%;
  margin: 0;
}

.wf-donate--split .wf-donate__bar {
  height: 4px;
  border-radius: 2px;
}

.wf-donate--split .wf-donate__bar span {
  border-radius: 2px;
}

.wf-donate--split .wf-donate__back {
  margin-bottom: 12px;
}

.wf-donate--split .wf-donate__heading {
  margin: 30px 0 0;
  font-size: 28px;
  line-height: 1.3;
  letter-spacing: -0.01em;
  text-align: left;
}

.wf-donate--split .wf-donate__step-label {
  margin-bottom: 4px;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: 0;
  color: #656667;
}

.wf-donate--split .wf-donate__fields {
  width: 100%;
  margin: 22px 0 0;
}

.wf-donate--split .wf-donate__group {
  margin-bottom: 0;
}

.wf-donate--split .wf-donate__options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 20px;
}

.wf-donate--split .wf-donate__option {
  gap: 16px;
  margin: 0;
  padding: 0 24px;
}

/* a round marker here, as in the design */
.wf-donate--split .wf-donate__option input {
  border-radius: 50%;
}

.wf-donate--split .wf-donate__field--other {
  margin-top: 12px;
}

.wf-donate--split .wf-donate__submit.wf-donate__next {
  margin-top: 36px;
}

.wf-donate__aside {
  margin: 32px 0 0;
  font-size: 14px;
  line-height: 1.4;
  color: #656667;
}

.wf-donate__aside a {
  color: #984f91;
  text-decoration: none;
}

.wf-donate__aside a:hover,
.wf-donate__aside a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* step 2: the name and the email side by side */
.wf-donate__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.wf-donate__row .wf-donate__field {
  margin-bottom: 0;
}

.wf-donate--split .wf-donate__check {
  margin-top: 32px;
}

/* the notes in two columns: Stripe | privacy, then tax | Florida */
.wf-donate--split .wf-donate__notes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 32px;
  margin-top: 24px;
}

.wf-donate--split .wf-donate__notes p {
  margin: 0;
}

/* the membership form in the split card: the two levels side by side, the Impact amounts in one row of three */
.wf-donate--split .wf-donate__impact {
  margin-top: 24px;
}

.wf-donate--split .wf-donate__options--amounts {
  grid-template-columns: repeat(3, 1fr);
}

.wf-donate--split .wf-donate__check.wf-donate__check--next {
  margin-top: 16px;
}

@media (max-width: 1100px) {
  .wf-donate--split .wf-donate__card {
    column-gap: 40px;
    padding-right: 40px;
  }
}

@media (max-width: 900px) {
  .wf-donate--split .wf-donate__inner {
    width: min(100%, 640px);
  }

  .wf-donate--split .wf-donate__card {
    display: block;
    padding: 40px 40px 48px;
  }

  .wf-donate--split .wf-donate__panel {
    min-height: 0;
    padding: 0;
    border-radius: 0;
    overflow: visible;
    background: none;
  }

  .wf-donate--split .wf-donate__photo,
  .wf-donate--split .wf-donate__panel::after {
    display: none;
  }

  .wf-donate--split .wf-donate__title {
    font-size: 40px;
    color: #462143;
  }

  .wf-donate--split .wf-donate__lead {
    margin-top: 12px;
    font-size: 16px;
    color: #656667;
  }

  .wf-donate--split .wf-donate__body {
    padding: 32px 0 0;
  }
}

@media (max-width: 600px) {
  .wf-donate--split {
    padding: 24px 24px 96px;
  }

  .wf-donate--split .wf-donate__card {
    padding: 32px 20px 40px;
  }

  .wf-donate--split .wf-donate__heading {
    font-size: 24px;
  }

  .wf-donate--split .wf-donate__options {
    gap: 12px;
  }

  .wf-donate--split .wf-donate__option {
    min-height: 64px;
    padding: 0 20px;
    font-size: 22px;
  }

  .wf-donate__row,
  .wf-donate--split .wf-donate__notes,
  .wf-donate--split .wf-donate__options--levels,
  .wf-donate--split .wf-donate__options--amounts {
    grid-template-columns: 1fr;
  }

  .wf-donate__row {
    gap: 24px;
  }
}

/* ---- womafreesm_request: a two-step request in the split card (Major support, Alina's PDF of 2026-11-04) ---- */
.wf-request .wf-donate__panel {
  min-height: 620px;
}

.wf-request .wf-donate__title {
  font-size: 44px;
  line-height: 53px;
  letter-spacing: 0;
}

.wf-request .wf-donate__lead {
  line-height: 23px;
  opacity: 0.85;
}

.wf-request .wf-donate__heading {
  font-size: 26px;
  letter-spacing: 0;
}

.wf-request .wf-donate__fields {
  margin-top: 27px;
}

.wf-request .wf-donate__input input,
.wf-request .wf-donate__input select {
  height: 37px;
}

.wf-request .wf-donate__input select {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 0 14px 0 40px;
  border: 1px solid #656667;
  border-radius: 6px;
  background: #fcfaf1;
  color: #221a1f;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.4;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.wf-request .wf-donate__input select.is-empty {
  color: #aeaeb0;
}

.wf-request .wf-donate__input select option {
  color: #221a1f;
}

.wf-request .wf-donate__input select:focus {
  outline: 2px solid #984f91;
  outline-offset: 1px;
  border-color: #984f91;
}

.wf-request__country {
  display: block;
  margin-top: 35px;
}

.wf-request .wf-donate__submit.wf-donate__next {
  margin-top: 35px;
}

.wf-request .wf-donate__field .wf-donate__error,
.wf-request [data-field] > .wf-donate__error {
  display: block;
  margin: 4px 0 0;
}

.wf-request .wf-donate__field .wf-donate__error[hidden],
.wf-request [data-field] > .wf-donate__error[hidden] {
  display: none;
}

.wf-request [data-field].is-bad input:not([type="checkbox"]),
.wf-request [data-field].is-bad select {
  border-color: #a32b2b;
}

.wf-request__message {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 88px;
  padding: 8px 14px;
  border: 1px solid #656667;
  border-radius: 6px;
  background: #fcfaf1;
  color: #221a1f;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.4;
  resize: vertical;
}

.wf-request__message:focus {
  outline: 2px solid #984f91;
  outline-offset: 1px;
  border-color: #984f91;
}

.wf-request__checks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 20px;
  margin-top: 40px;
}

.wf-request .wf-request__checks .wf-donate__check {
  gap: 10px;
  margin: 0;
  padding-left: 8px;
  line-height: 18px;
}

.wf-request .wf-request__checks .wf-donate__check input {
  margin-top: 2px;
}

.wf-request [data-wf-request-submit] {
  margin-top: 40px;
}

/* the screen after sending */
.wf-request-thanks.wf-donate--thanks {
  padding-top: 72px;
  padding-bottom: 160px;
}

.wf-request-thanks .wf-donate__thanks-lead {
  margin-top: 59px;
}

.wf-request-thanks .wf-donate__submit.wf-donate__thanks-button {
  margin-top: 87px;
}

@media (max-width: 900px) {
  .wf-request .wf-donate__panel {
    min-height: 0;
  }

  .wf-request .wf-donate__title {
    font-size: 40px;
    line-height: 48px;
  }

  .wf-request .wf-donate__lead {
    opacity: 1;
  }
}

@media (max-width: 600px) {
  .wf-request__checks {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .wf-request .wf-request__checks .wf-donate__check {
    padding-left: 0;
  }

  .wf-request-thanks.wf-donate--thanks {
    padding-top: 64px;
    padding-bottom: 96px;
  }

  .wf-request-thanks .wf-donate__thanks-title {
    font-size: 54px;
  }

  .wf-request-thanks .wf-donate__thanks-lead {
    margin-top: 24px;
    font-size: 16px;
  }

  .wf-request-thanks .wf-donate__submit.wf-donate__thanks-button {
    margin-top: 40px;
  }
}

/* womafreesm_request: measured against the PDF at 1440 */
.wf-request .wf-donate__fields {
  margin-top: 28px;
}

.wf-request .wf-donate__field .wf-donate__label {
  margin-bottom: 2px;
}

.wf-request .wf-donate__back {
  margin-bottom: 9px;
}

.wf-request .wf-request__checks .wf-donate__check span {
  max-width: 252px;
}

@media (max-width: 900px) {
  .wf-request .wf-request__checks .wf-donate__check span {
    max-width: none;
  }
}

/* womafreesm_request: the screen after sending, and the phone */
.wf-request-thanks .wf-donate__thanks-lead {
  margin-top: 69px;
}

@media (max-width: 600px) {
  .wf-request__country {
    margin-top: 24px;
  }

  .wf-request-thanks .wf-donate__thanks-lead {
    margin-top: 24px;
  }
}

/* ---- womafreesm_order_apply: the application to The Order, six steps in the split card (Alina's PDFs of 2026-11-04) ---- */
.wf-order .wf-donate__panel {
  min-height: 560px;
}

.wf-order .wf-donate__fields > .wf-donate__label {
  margin: 0 0 22px;
}

.wf-order__hint {
  margin: 17px 0 0;
  color: #656667;
  font-size: 14px;
  line-height: 18px;
}

.wf-order__hint--24 {
  margin-top: 24px;
}

.wf-order__hint--32 {
  margin-top: 32px;
}

.wf-order .wf-donate__submit.wf-donate__next {
  margin-top: 24px;
}

.wf-order .wf-donate__submit.wf-donate__next.wf-order__next-40 {
  margin-top: 40px;
}

.wf-order__book {
  display: block;
  margin-top: 24px;
}

.wf-order__group {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.wf-order__group > .wf-donate__label {
  display: block;
  margin: 0 0 30px;
  padding: 0;
}

.wf-order__options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 44px 20px;
}

.wf-order__option {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 0;
  padding-left: 9px;
  color: #221a1f;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  cursor: pointer;
}

.wf-order__option input {
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
  margin: 2px 0 0;
  accent-color: #984f91;
}

.wf-order__group > .wf-donate__error {
  display: block;
  margin: 12px 0 0;
}

.wf-order__group > .wf-donate__error[hidden] {
  display: none;
}

/* the voice message */
.wf-order__voice {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 174px;
  gap: 20px;
}

.wf-order .wf-order__record {
  margin-top: 0;
}

.wf-order .wf-order__record.is-on {
  border-color: #5d295f;
  background: #5d295f;
}

.wf-order .wf-order__record[hidden] {
  display: none;
}

.wf-order__voice:has(.wf-order__record[hidden]) {
  grid-template-columns: minmax(0, 1fr);
}

.wf-order__upload {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin: 0;
  border: 1px solid #221a1f;
  border-radius: 8px;
  color: #221a1f;
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
  cursor: pointer;
  transition: background-color 160ms ease, color 160ms ease;
}

.wf-order__upload:hover,
.wf-order__upload:focus-within {
  background: #221a1f;
  color: #fcfaf1;
}

.wf-order__upload input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.wf-order__timer {
  margin: 24px 0 0;
  color: #656667;
  font-size: 14px;
  line-height: 18px;
}

.wf-order__player {
  display: block;
  width: 100%;
  height: 40px;
  margin-top: 16px;
}

.wf-order__player[hidden] {
  display: none;
}

.wf-order .wf-donate__fields > .wf-donate__error {
  display: block;
  margin: 12px 0 0;
}

.wf-order .wf-donate__fields > .wf-donate__error[hidden] {
  display: none;
}

/* the last step: full-width boxes */
.wf-order__checks {
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin-top: 51px;
}

.wf-order .wf-order__checks .wf-donate__check {
  gap: 10px;
  margin: 0;
  padding-left: 8px;
  line-height: 18px;
}

.wf-order .wf-order__checks .wf-donate__check input {
  margin-top: 2px;
}

.wf-order [data-field="consent"] > .wf-donate__error {
  display: block;
  margin: 8px 0 0;
}

.wf-order [data-field="consent"] > .wf-donate__error[hidden] {
  display: none;
}

.wf-order [data-order-submit] {
  margin-top: 40px;
}

/* the screen after sending */
.wf-order-thanks.wf-donate--thanks {
  padding-top: 104px;
  padding-bottom: 196px;
}

.wf-order-thanks .wf-donate__thanks-lead {
  margin-top: 61px;
}

.wf-order-thanks .wf-donate__thanks-text {
  max-width: 620px;
  line-height: 21px;
}

.wf-order-thanks .wf-donate__submit.wf-donate__thanks-button {
  margin-top: 18px;
}

@media (max-width: 900px) {
  .wf-order .wf-donate__panel {
    min-height: 0;
  }
}

@media (max-width: 600px) {
  .wf-order__options {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }

  .wf-order__option {
    padding-left: 0;
  }

  .wf-order__voice {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .wf-order .wf-order__checks .wf-donate__check {
    padding-left: 0;
  }

  .wf-order-thanks.wf-donate--thanks {
    padding-top: 64px;
    padding-bottom: 96px;
  }

  .wf-order-thanks .wf-donate__thanks-lead {
    margin-top: 24px;
  }

  .wf-order-thanks .wf-donate__submit.wf-donate__thanks-button {
    margin-top: 32px;
  }
}

/* womafreesm_order_apply: measured against the PDF at 1440 */
.wf-order .wf-request__country,
.wf-order .wf-order__book {
  margin-bottom: 0;
}

.wf-order .wf-order__book .wf-donate__label {
  margin-bottom: 2px;
}