/* FIC donation form: scoped Charitable shortcode overrides. */


.fic-donation-form {
  --fic-donation-pad: 28px;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  /* Do not anchor the page to frequency/actions while Custom expands. */
  overflow-anchor: none;
  border: 1px solid rgba(201, 168, 76, .22);
  border-radius: var(--fic-radius-card);
  background: var(--fic-teal-mid);
  box-shadow: var(--fic-shadow-deep);
  color: rgba(255, 255, 255, .78);
  padding: 0;
}

.fic-donation-form.fic-form--dark {
  --fic-form-control-bg: var(--fic-teal-deep);
  --fic-form-control-focus-bg: var(--fic-teal-deep);
  
  --fic-form-control-border: rgba(255, 255, 255, .3);
  --fic-form-placeholder: rgba(255, 255, 255, .72);
  --fic-form-label: rgba(255, 255, 255, .85);
  --fic-form-invalid: #ffc3c3;
}

.fic-donation-form.has-donation-js {
  scroll-margin-top: calc(var(--fic-header-height) + 24px);
  transition: height 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

.fic-donation-form.is-step-changing {
  overflow: hidden;
}

.fic-donation-form.has-donation-js .charitable-visual-donation-form {
  transition: opacity 0.26s ease, transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.fic-donation-form.is-step-changing .charitable-visual-donation-form {
  opacity: 0.9;
  transform: translateY(4px);
}

.fic-donation-form.is-step-settling .charitable-visual-donation-form {
  opacity: 1;
  transform: translateY(0);
}

.fic-donation-form > * {
  position: relative;
  z-index: 1;
}

.fic-donation-form .login-prompt,
.fic-donation-form .charitable-login-form {
  display: none !important;
}

.fic-donation-form .charitable-visual-donation-form {
  --charitable-text-color: rgba(255, 255, 255, 0.78) !important;
  --charitable-label-color: rgba(255, 255, 255, 0.66) !important;
  --charitable-input-bg: var(--fic-teal-deep) !important;
  --charitable-input-text-color: var(--fic-white) !important;
  --charitable-input-border-color: rgba(255, 255, 255, 0.12) !important;
  --charitable-input-border-radius: var(--fic-radius-sm) !important;
  --charitable-focus-ring-color: var(--fic-gold) !important;
  --charitable-button-bg: var(--fic-gold) !important;
  --charitable-button-text-color: var(--fic-teal-deep) !important;
  --charitable-button-border-radius: var(--fic-radius-sm) !important;
  --charitable-font-family: var(--fic-font-heading) !important;
  width: 100%;
  margin: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(255, 255, 255, 0.78);
}

.fic-donation-form .charitable-form-fields,
.fic-donation-form .charitable-fieldset {
  border: 0 !important;
  padding: 0 !important;
}

.fic-donation-form .charitable-fieldset {
  margin: 0 0 24px !important;
}

.fic-donation-form .charitable-form-field {
  margin-bottom: 16px !important;
}

.fic-donation-form .charitable-form-field:last-child {
  margin-bottom: 0 !important;
}

.fic-donation-form .charitable-field-label,
.fic-donation-form .charitable-form-field > label,
.fic-donation-form #charitable-gateway-selector-header,
.fic-donation-form label[for="charitable_stripe_card_field"] {
  display: block;
  margin: 0 0 8px !important;
  color: var(--fic-form-label) !important;
  font-family: var(--fic-font-heading) !important;
  font-size: var(--fic-type-form-label-size) !important;
  font-weight: var(--fic-type-form-label-weight) !important;
  letter-spacing: 0 !important;
  line-height: var(--fic-type-form-label-leading);
  text-transform: uppercase;
}

.fic-donation-form abbr.required {
  color: var(--fic-gold) !important;
  text-decoration: none !important;
}

.fic-donation-form .charitable-form-fields {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
}

.fic-donation-form .charitable-multistep-header-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  gap: 12px;
  margin: 0;
  padding: 22px var(--fic-donation-pad) 19px;
  border: 0;
  background: var(--fic-teal-deep);
}

.fic-donation-form .charitable-multistep-header-row::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--fic-pattern-geometric) repeat top left / 680px auto;
  opacity: .045;
  pointer-events: none;
}

.fic-donation-form .charitable-multistep-fields-container {
  grid-column: 1 / -1;
  padding: var(--fic-donation-pad) var(--fic-donation-pad) 0;
}

.fic-donation-form .charitable-multistep-step-title {
  margin: 0;
  color: var(--fic-white);
  font-family: var(--fic-font-heading) !important;
  font-size: var(--fic-type-panel-size);
  font-weight: var(--fic-type-panel-weight);
  letter-spacing: 0;
  line-height: var(--fic-type-panel-leading);
}

/* Keep Charitable's live progress values and accessible progressbar intact. */
.fic-donation-form .charitable-multistep-progress {
  position: static;
  margin: 0;
  width: auto;
}

.fic-donation-form .charitable-multistep-progress-bar {
  position: absolute;
  inset: auto 0 0;
  height: 3px !important;
  margin: 0 !important;
  border-radius: 0;
  background: var(--fic-teal-mid) !important;
  overflow: hidden;
}

.fic-donation-form .charitable-multistep-progress-fill {
  height: 100%;
  border-radius: inherit;
  background: var(--fic-gold) !important;
}

.fic-donation-form .charitable-multistep-progress-line .charitable-multistep-progress-text {
  color: var(--fic-gold) !important;
  font: 800 0/1.4 var(--fic-font-heading) !important;
  text-transform: uppercase;
  white-space: nowrap;
}

.fic-donation-form .charitable-multistep-progress-text::before {
  content: "Step ";
  font-size: 11px;
}

.fic-donation-form .charitable-multistep-step-current::after {
  content: " of ";
}

.fic-donation-form .charitable-multistep-step-current,
.fic-donation-form .charitable-multistep-step-total {
  color: inherit !important;
  font: 800 11px/1.4 var(--fic-font-heading) !important;
}

.fic-donation-form .charitable-multistep-footer-row {
  grid-column: 1 / -1;
  margin: 0;
  padding: 20px var(--fic-donation-pad) max(24px, env(safe-area-inset-bottom));
  border-top: 1px solid rgba(255, 255, 255, .09);
}

.fic-donation-form .charitable-multistep-navigation {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}

.fic-donation-form .charitable-multistep-button,
.fic-donation-form .charitable-donate-button-submit {
  min-height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  border-radius: var(--fic-radius-sm) !important;
  cursor: pointer;
  font-family: var(--fic-font-heading) !important;
  font-size: var(--fic-type-button-size) !important;
  font-weight: var(--fic-type-button-weight) !important;
  letter-spacing: 0 !important;
  line-height: var(--fic-type-button-leading) !important;
  padding: 13px 32px !important;
  text-transform: uppercase;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.fic-donation-form .charitable-multistep-button-next,
.fic-donation-form .charitable-donate-button-submit {
  flex: 1;
  border-color: var(--fic-gold) !important;
  background: var(--fic-gold) !important;
  color: var(--fic-teal-deep) !important;
}

/* Match the campaign-scoped inline hover rule emitted by the shortcode. */
.fic-donation-form .charitable-multistep-button-next:hover:not(:disabled):not([aria-disabled="true"]),
.fic-donation-form .charitable-donate-button-submit:hover:not(:disabled):not([aria-disabled="true"]),
.fic-donation-form #charitable-visual-donation-form-342 .charitable-donate-button-submit:hover:not(:disabled):not([aria-disabled="true"]) {
  border-color: var(--fic-gold-light) !important;
  background: var(--fic-gold-light) !important;
  transform: translateY(-1px);
}

.fic-donation-form .charitable-multistep-button-prev {
  flex: 0 0 auto;
  width: auto;
  min-height: 44px;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  color: var(--fic-white) !important;
  padding: 10px 0 !important;
  font-size: var(--fic-type-button-size) !important;
  font-weight: var(--fic-type-button-secondary-weight) !important;
  text-transform: none;
  text-decoration: underline;
  text-decoration-color: var(--fic-gold);
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}

.fic-donation-form .charitable-multistep-button-prev:hover:not(:disabled):not([aria-disabled="true"]) {
  color: var(--fic-gold-light) !important;
}

.fic-donation-form .charitable-multistep-button:focus-visible,
.fic-donation-form .charitable-donate-button-submit:focus-visible {
  outline: 2px solid var(--fic-gold);
  outline-offset: 3px;
}

.fic-donation-form .charitable-multistep-button:disabled,
.fic-donation-form .charitable-donate-button-submit:disabled,
.fic-donation-form .charitable-multistep-button[aria-disabled="true"],
.fic-donation-form .charitable-donate-button-submit[aria-disabled="true"] {
  opacity: 1;
  border-color: var(--fic-line-on-dark) !important;
  background: var(--fic-teal-light) !important;
  color: rgba(255, 255, 255, .72) !important;
  cursor: not-allowed;
  transform: none;
}

.fic-donation-form .charitable-multistep-button:active:not(:disabled):not([aria-disabled="true"]),
.fic-donation-form .charitable-donate-button-submit:active:not(:disabled):not([aria-disabled="true"]) {
  transform: translateY(1px);
}

/* Preserve the plugin's two lists and radio/input ownership. For five presets,
   the second list occupies the spare sixth tile without flattening Safari lists. */
.fic-donation-form .charitable-donation-options {
  --fic-amount-grid-gap: 10px;
  --fic-amount-grid-columns: 3;
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: var(--fic-amount-grid-gap) !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
}

.fic-donation-form .charitable-donation-options .donation-amounts {
  display: grid !important;
  grid-template-columns: repeat(var(--fic-amount-grid-columns), minmax(0, 1fr)) !important;
  gap: var(--fic-amount-grid-gap) !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.fic-donation-form .charitable-donation-options .donation-suggested-amount {
  display: block !important;
}

.fic-donation-form .charitable-donation-options:has(> .donation-amounts-count-5),
.fic-donation-form .charitable-donation-options > .charitable-session-content:has(> .donation-amounts-count-5) {
  display: grid !important;
  gap: var(--fic-amount-grid-gap) !important;
  grid-template-columns: repeat(var(--fic-amount-grid-columns), minmax(0, 1fr)) !important;
}

.fic-donation-form .charitable-donation-options .donation-amounts-count-5 {
  grid-column: 1 / -1;
  grid-row: 1;
}

.fic-donation-form .donation-amounts-count-5 + .donation-suggested-amount {
  grid-column: var(--fic-amount-grid-columns);
  grid-row: 1;
  align-self: end;
}

.fic-donation-form .donation-amount,
.fic-donation-form .custom-donation-amount-wrapper {
  min-width: 0;
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  list-style: none !important;
}

.fic-donation-form .custom-donation-amount-wrapper { display: block !important; }
.fic-donation-form .charitable-donation-options .custom-donation-amount { position: static !important; }

.fic-donation-form .donation-amount input[type="radio"],
.fic-donation-form #charitable-gateway-selector li input[type="radio"] {
  position: absolute !important;
  display: block !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.fic-donation-form .donation-amount label,
.fic-donation-form .charitable-donation-options li.custom-donation-amount .custom-donation-amount-wrapper > label,
.fic-donation-form #charitable-gateway-selector li label {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  /* Charitable's three-class preset-label rule otherwise restores 24px. */
  min-height: 56px !important;
  box-sizing: border-box;
  margin: 0 !important;
  border: 1px solid var(--fic-line-on-dark) !important;
  border-radius: var(--fic-radius-sm) !important;
  background: var(--fic-teal-deep) !important;
  color: var(--fic-white) !important;
  cursor: pointer;
  font-family: var(--fic-font-heading) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  padding: 8px 6px !important;
  text-align: center;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.fic-donation-form .donation-amount label:hover,
.fic-donation-form #charitable-gateway-selector li label:hover {
  border-color: rgba(201, 168, 76, 0.55) !important;
  background: var(--fic-teal-light) !important;
}

.fic-donation-form .donation-amount .amount {
  color: inherit !important;
  font: 800 20px/1.35 var(--fic-font-heading);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* An empty plugin description still creates a 20px flex gap and offsets the
   amount. Remove only that empty item; retain genuine campaign descriptions. */
.fic-donation-form .donation-amount label > .description:empty {
  display: none !important;
}

.fic-donation-form .donation-amount.selected label,
.fic-donation-form .charitable-visual-donation-form .donation-amounts .donation-amount.selected label,
.fic-donation-form .donation-amount:has(input[name="donation_amount"]:checked) label,
.fic-donation-form #charitable-gateway-selector li:has(input:checked) label {
  border-color: var(--fic-gold) !important;
  background: var(--fic-gold) !important;
  color: var(--fic-teal-deep) !important;
}

.fic-donation-form .charitable-visual-donation-form .donation-amounts .donation-amount.selected {
  background: transparent !important;
  box-shadow: none !important;
}

.fic-donation-form .donation-amount label::before,
.fic-donation-form .donation-amount label::after {
  display: none !important;
  content: none !important;
}

.fic-donation-form .custom-donation-amount-wrapper > label {
  font-size: 14px !important;
  text-transform: none;
  white-space: normal;
  overflow-wrap: normal;
}

.fic-donation-form .custom-donation-amount-wrapper > label .description {
  color: inherit !important;
  font: inherit !important;
  /* The plugin uses max-content here; allow words to wrap within narrow tiles. */
  width: auto !important;
  max-width: 100%;
}

/* The native input stays in its original li. Animated space moves the next
   group in normal flow; clipping reveals the field without overlapping it. */
.fic-donation-form .charitable-donation-options:has(.custom-donation-amount input[name="donation_amount"]:checked) {
  padding-bottom: var(--fic-custom-space, 66px) !important;
}

.fic-donation-form .charitable-donation-options.has-custom-reveal {
  transition: padding-bottom 250ms ease;
}

.fic-donation-form .charitable-donation-options .custom-donation-input {
  display: block !important;
  position: absolute;
  inset: auto 0 0;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-6px);
  clip-path: inset(0 0 100% 0);
}

.fic-donation-form .has-custom-reveal .custom-donation-input {
  top: var(--fic-custom-top);
  bottom: auto;
  transition: opacity 250ms ease, transform 250ms ease, clip-path 250ms ease, visibility 0s linear 250ms;
}

.fic-donation-form .custom-donation-amount:has(input[name="donation_amount"]:checked) .custom-donation-input {
  border-color: var(--fic-gold) !important;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  clip-path: inset(-6px);
  transition-delay: 0s;
}

/* Charitable visual-theme-base resets fieldsets with a stronger !important
   rule. Give only the purpose group its intended separation from amounts. */
.fic-donation-form .charitable-fields-grid > .charitable-fieldset[data-step="1"]:has(> #charitable_field_field_14) {
  margin-bottom: var(--fic-space-md) !important;
}

.fic-donation-form input[type="text"],
.fic-donation-form input[type="email"],
.fic-donation-form select,
.fic-donation-form .custom-donation-input {
  width: 100% !important;
  min-height: calc(1em * var(--fic-type-form-control-leading) + 28px) !important;
  border: 1px solid var(--fic-form-control-border) !important;
  border-radius: var(--fic-radius-sm) !important;
  background-color: var(--fic-form-control-bg) !important;
  box-shadow: none !important;
  color: var(--fic-white) !important;
  font-family: var(--fic-font-body) !important;
  font-size: max(16px, var(--fic-type-form-control-size)) !important;
  font-weight: var(--fic-type-form-control-weight) !important;
  line-height: var(--fic-type-form-control-leading) !important;
  outline: none !important;
  padding: 13px 14px !important;
}

.fic-donation-form select,
.fic-donation-form #charitable_field_field_14 select,
.fic-donation-form select#charitable_field_field_14_element,
.fic-donation-form select[name="field_14"],
.fic-donation-form #charitable_field_title select,
.fic-donation-form #charitable_field_country select,
.fic-donation-form select#charitable_field_title_element,
.fic-donation-form select#charitable_field_country_element {
  min-height: 50px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255, 255, 255, 0.82) 50%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.82) 50%, transparent 50%) !important;
  background-position:
    calc(100% - 22px) 50%,
    calc(100% - 15px) 50% !important;
  background-repeat: no-repeat !important;
  background-size: 7px 7px, 7px 7px !important;
  cursor: pointer !important;
  font-family: var(--fic-font-heading) !important;
  font-weight: 800 !important;
  padding-right: 48px !important;
}

.fic-donation-form input::placeholder {
  color: rgba(255, 255, 255, 0.44) !important;
}

.fic-donation-form input:focus,
.fic-donation-form select:focus,
.fic-donation-form #charitable_field_field_14 select:focus,
.fic-donation-form select#charitable_field_field_14_element:focus,
.fic-donation-form select[name="field_14"]:focus,
.fic-donation-form #charitable_field_title select:focus,
.fic-donation-form #charitable_field_country select:focus,
.fic-donation-form select#charitable_field_title_element:focus,
.fic-donation-form select#charitable_field_country_element:focus {
  border-color: rgba(201, 168, 76, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.12) !important;
}

.fic-donation-form option,
.fic-donation-form #charitable_field_field_14 option,
.fic-donation-form select#charitable_field_field_14_element option,
.fic-donation-form select[name="field_14"] option,
.fic-donation-form #charitable_field_title option,
.fic-donation-form #charitable_field_country option,
.fic-donation-form select#charitable_field_title_element option,
.fic-donation-form select#charitable_field_country_element option {
  background: var(--fic-teal-mid) !important;
  color: var(--fic-white) !important;
}

.fic-donation-form select[name="field_14"] option[value=""],
.fic-donation-form select#charitable_field_field_14_element option[value=""] {
  display: none;
}

.fic-donation-form .charitable-form-field-recurring-donation {
  margin-top: 0 !important;
}

.fic-donation-form .charitable-form-field-recurring-donation > label,
.fic-donation-form .charitable-form-field-recurring-donation > .charitable-field-label,
.fic-donation-form .charitable-form-field-recurring-donation legend,
.fic-donation-form .charitable-recurring-donation-field legend {
  display: block !important;
  margin: 0 0 10px !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-family: var(--fic-font-heading) !important;
  font-size: var(--fic-type-form-label-size) !important;
  font-weight: var(--fic-type-form-label-weight) !important;
  line-height: var(--fic-type-form-label-leading);
  padding: 0 !important;
  text-transform: uppercase;
}

.fic-donation-form .charitable-recurring-donation-field {
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
}

.fic-donation-form .charitable-form-field-recurring-donation ul,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-recurring-options,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-radio-list,
.fic-donation-form .charitable-recurring-period-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.fic-donation-form .charitable-form-field-recurring-donation li {
  position: relative;
  min-width: 0;
  margin: 0 !important;
  list-style: none !important;
}

.fic-donation-form .charitable-form-field-recurring-donation li label,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-radio-list label,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-recurring-options label,
.fic-donation-form .charitable-recurring-period-list label {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 56px;
  box-sizing: border-box;
  margin: 0 !important;
  border: 1px solid var(--fic-line-on-dark) !important;
  border-radius: var(--fic-radius-sm);
  background: var(--fic-teal-deep) !important;
  color: var(--fic-white) !important;
  cursor: pointer;
  font-family: var(--fic-font-heading) !important;
  font-size: var(--fic-type-button-size) !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.35;
  padding: 12px 4px;
  text-align: center;
  text-transform: uppercase;
}

.fic-donation-form .charitable-form-field-recurring-donation li label:hover,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-radio-list label:hover,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-recurring-options label:hover,
.fic-donation-form .charitable-recurring-period-list label:hover {
  border-color: rgba(201, 168, 76, 0.32) !important;
  background: var(--fic-teal-light) !important;
}

.fic-donation-form .charitable-form-field-recurring-donation li:has(input[type="radio"]:checked) label,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-radio-list label:has(input[type="radio"]:checked),
.fic-donation-form .charitable-form-field-recurring-donation .charitable-recurring-options label:has(input[type="radio"]:checked),
.fic-donation-form .charitable-recurring-period-list label:has(input[type="radio"]:checked) {
  border-color: var(--fic-gold) !important;
  background: var(--fic-gold) !important;
  color: var(--fic-teal-deep) !important;
  box-shadow: none;
}

.fic-donation-form .charitable-form-field-recurring-donation input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.fic-donation-form .charitable-form-field-recurring-donation input[type="checkbox"] {
  position: relative !important;
  flex: 0 0 54px !important;
  width: 54px !important;
  height: 30px !important;
  min-width: 54px !important;
  min-height: 30px !important;
  margin: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 999px !important;
  background: var(--fic-teal-deep) !important;
  cursor: pointer;
  appearance: none !important;
  -webkit-appearance: none !important;
  transition: background-color 0.25s ease, border-color 0.25s ease;
}

.fic-donation-form .charitable-form-field-recurring-donation input[type="checkbox"]::before {
  display: none !important;
  content: none !important;
}

.fic-donation-form .charitable-form-field-recurring-donation input[type="checkbox"]::after {
  position: absolute !important;
  top: 1px !important;
  left: 1px !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 999px !important;
  background: var(--fic-white) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18) !important;
  content: "" !important;
  transition: left 0.25s ease;
}

.fic-donation-form .charitable-form-field-recurring-donation input[type="checkbox"]:checked {
  border-color: rgba(201, 168, 76, 0.55) !important;
  background: var(--fic-gold) !important;
}

.fic-donation-form .charitable-form-field-recurring-donation input[type="checkbox"]:checked::after {
  left: 25px !important;
}

.fic-donation-form #charitable-meta-fields {
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
}

.fic-donation-form #charitable-meta-fields .charitable-form-content:first-of-type,
.fic-donation-form #charitable_field_giftaid,
.fic-donation-form #charitable-meta-fields .charitable-form-content:nth-of-type(2) {
  border: 0;
  border-left: 3px solid var(--fic-gold);
  border-radius: 0;
  background: none;
}

.fic-donation-form #charitable-meta-fields .charitable-form-content:first-of-type {
  margin: 0 !important;
  padding: 2px 0 0 18px;
}

.fic-donation-form #charitable-meta-fields .charitable-form-content:first-of-type strong {
  display: block;
  color: var(--fic-white) !important;
  font-family: var(--fic-font-heading) !important;
  font-size: 1rem;
  font-weight: var(--fic-weight-heavy);
  line-height: 1.4;
}

.fic-donation-form #charitable_field_giftaid {
  position: relative;
  margin: 0 !important;
  border-top: 0;
  border-bottom: 0;
  padding: 14px 0 10px 58px !important;
}

.fic-donation-form #charitable_field_giftaid label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.76) !important;
  font-family: var(--fic-font-heading) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.45;
  text-transform: none;
}

/* The real sibling checkbox remains native, focusable and submitted by Charitable. */
.fic-donation-form #charitable_field_giftaid input[type="checkbox"] {
  position: absolute !important;
  top: 14px;
  left: 18px;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  margin: 0 !important;
  border: 2px solid rgba(255, 255, 255, .5) !important;
  border-radius: var(--fic-radius-sm) !important;
  background: var(--fic-teal-deep) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer;
}
.fic-donation-form #charitable_field_giftaid input:checked {
  background: var(--fic-gold) !important;
  border-color: var(--fic-gold) !important;
}
.fic-donation-form #charitable_field_giftaid input:checked::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 7px;
  width: 7px;
  height: 13px;
  border: solid var(--fic-teal-deep);
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}
.fic-donation-form #charitable_field_giftaid input:focus-visible {
  outline: 2px solid var(--fic-gold-light) !important;
  outline-offset: 3px;
}

.fic-donation-form #charitable-meta-fields .charitable-form-content:nth-of-type(2) {
  margin: 0 !important;
  border-top: 0;
  border-radius: 0;
  color: rgba(255, 255, 255, 0.62) !important;
  font-size: 0.8125rem !important;
  line-height: 1.6 !important;
  padding: 0 0 2px 58px;
}

.fic-donation-form .charitable-donor-name-fields-container,
.fic-donation-form .charitable-address-compact-row,
.fic-donation-form .fic-donation-inline-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.fic-donation-form .charitable-visual-donation-form .charitable-fieldset.charitable-donor-name-side-by-side .charitable-donor-name-fields-container .charitable-form-field,
.fic-donation-form .charitable-visual-donation-form .charitable-address-fields-container.charitable-address-fields-compact .charitable-address-compact-row .charitable-form-field,
.fic-donation-form .fic-donation-inline-row .charitable-form-field {
  display: flex !important;
  flex-direction: column !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: 1 1 0 !important;
  margin-bottom: 0 !important;
  box-sizing: border-box !important;
}

.fic-donation-form #charitable_field_first_name,
.fic-donation-form #charitable_field_last_name,
.fic-donation-form #charitable_field_city,
.fic-donation-form #charitable_field_postcode,
.fic-donation-form #charitable_field_zip,
.fic-donation-form #charitable_field_address_city,
.fic-donation-form #charitable_field_address_postcode,
.fic-donation-form #charitable_field_address_zip {
  min-width: 0;
}

.fic-donation-form #charitable_field_first_name,
.fic-donation-form #charitable_field_last_name {
  margin-bottom: 0 !important;
}

.fic-donation-form .charitable-form-content,
.fic-donation-form .charitable-donation-total {
  color: rgba(255, 255, 255, 0.74) !important;
  font-size: 0.875rem;
  line-height: 1.6;
}

.fic-donation-form .charitable-form-content strong,
.fic-donation-form .charitable-donation-total {
  color: var(--fic-white) !important;
  font-weight: 800;
}

.fic-donation-form .charitable-donation-total {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin: 20px 0 0 !important;
  border: 0;
  border-block: 1px solid rgba(255, 255, 255, .09);
  border-radius: 0;
  background: none;
  box-shadow: none;
  font-family: var(--fic-font-heading) !important;
  padding: 18px 0 !important;
}

.fic-donation-form .charitable-donation-total .total-amount {
  color: var(--fic-gold) !important;
  font: var(--fic-type-panel-weight) var(--fic-type-panel-size)/var(--fic-type-panel-leading) var(--fic-font-heading);
}

.fic-donation-form .charitable-form-divider {
  height: 1px !important;
  margin: 24px 0 !important;
  border: 0 !important;
  background: rgba(255, 255, 255, 0.09) !important;
}

.fic-donation-form .charitable-payment-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  height: auto !important;
  margin: 24px 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.fic-donation-form .charitable-payment-divider::before,
.fic-donation-form .charitable-payment-divider::after {
  flex: 1;
  height: 1px;
  background: rgba(255, 255, 255, 0.09);
  content: "";
}

.fic-donation-form .charitable-payment-divider span {
  color: var(--fic-text-on-dark-muted);
  font-family: var(--fic-font-heading);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.fic-donation-form #charitable-gateway-fields {
  margin-top: 0 !important;
}

.fic-donation-form .charitable-payment-section-fieldset > .charitable-form-divider { display: none; }
.fic-donation-form .charitable-payment-section-fieldset .charitable-fieldset { margin-bottom: 0 !important; }

.fic-donation-form #charitable-gateway-selector {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px !important;
  width: 100%;
  margin: 0 0 16px !important;
  padding: 0 !important;
  list-style: none !important;
}

.fic-donation-form #charitable-gateway-selector li {
  position: relative;
  min-width: 0;
  margin: 0 !important;
  list-style: none !important;
}

.fic-donation-form #charitable-gateway-selector li label {
  min-height: 52px;
  font-size: 0.875rem !important;
}

.fic-donation-form.is-paypal-selected #charitable-gateway-fields .charitable-form-content,
.fic-donation-form.is-paypal-selected .charitable-payment-instructions,
.fic-donation-form.is-paypal-selected .charitable-gateway-instructions,
.fic-donation-form.is-paypal-selected .charitable-paypal-instructions,
.fic-donation-form.is-paypal-selected .fic-donation-paypal-instruction,
.fic-donation-form.is-paypal-selected p:has(+ .charitable-submit-field) {
  display: none !important;
}

.fic-donation-form #charitable_stripe_express_checkout_field {
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: var(--fic-radius-sm) !important;
  background: rgba(255, 255, 255, 0.05) !important;
  padding: 16px !important;
}

.fic-donation-form #charitable_stripe_express_checkout_field,
.fic-donation-form #charitable_stripe_express_checkout_field iframe {
  overflow: hidden !important;
  border-radius: var(--fic-radius-sm) !important;
}

.fic-donation-form #charitable_stripe_card_field {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 52px !important;
  border: 1px solid rgba(201, 168, 76, 0.34) !important;
  border-radius: var(--fic-radius-sm) !important;
  background: var(--fic-white) !important;
  padding: 16px !important;
}

.fic-donation-form .charitable-submit-field {
  grid-column: 2;
  align-items: stretch !important;
  margin: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, .09) !important;
  padding: 20px var(--fic-donation-pad) max(24px, env(safe-area-inset-bottom)) 18px !important;
}

/* The plugin renders Previous and final submit in adjacent containers. */
.fic-donation-form .charitable-form-fields:has(.charitable-multistep-step-header[data-step="3"].charitable-multistep-field-visible) > .charitable-multistep-footer-row {
  grid-column: 1;
  padding-right: 0;
}

.fic-donation-form .charitable-donate-button-submit {
  width: 100%;
  min-height: 52px;
}

@media (prefers-reduced-motion: reduce) {
  .fic-donation-form *,
  .fic-donation-form *::before,
  .fic-donation-form *::after {
    transition-duration: 0.01ms !important;
  }
}

/* Charitable 1.8.17.9 adapter: observed donor/purpose/amount wrappers only.
   Do not enrol the whole plugin form in .fic-form: gateway fields stay plugin-owned. */
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select) {
  background-color: var(--fic-form-control-bg) !important;
  border-color: var(--fic-form-control-border) !important;
  border-radius: var(--fic-radius-sm) !important;
  color: var(--fic-form-control-text) !important;
  font-family: var(--fic-font-body) !important;
  font-size: max(16px, var(--fic-type-form-control-size)) !important;
  font-weight: var(--fic-type-form-control-weight) !important;
  line-height: var(--fic-type-form-control-leading) !important;
  min-height: calc(1em * var(--fic-type-form-control-leading) + 28px) !important;
  padding: 13px 14px !important;
}
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) select { padding-right: 48px !important; }
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) input::placeholder { color: var(--fic-form-placeholder) !important; opacity: 1; }
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select):focus {
  background-color: var(--fic-form-control-focus-bg) !important;
  border-color: var(--fic-gold) !important;
}
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select):focus-visible {
  outline: 2px solid var(--fic-gold) !important;
  outline-offset: 3px !important;
}
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select).charitable-field-error,
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select)[aria-invalid="true"],
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select):user-invalid { border-color: var(--fic-form-invalid) !important; }
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select):disabled {
  opacity: 1 !important;
  background-color: var(--fic-teal-light) !important;
  border-color: var(--fic-line-on-dark) !important;
  color: rgba(255, 255, 255, .72) !important;
  cursor: not-allowed !important;
}
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) input:is(:autofill, :-webkit-autofill) {
  -webkit-text-fill-color: var(--fic-white);
  box-shadow: 0 0 0 1000px var(--fic-teal-deep) inset !important;
  caret-color: var(--fic-white);
}
.fic-donation-form.fic-form--dark :is(.fic-donate-name, .fic-donate-email, .fic-donate-address, #charitable_field_field_14, .custom-donation-amount) .charitable-form-field > label,
.fic-donation-form.fic-form--dark #charitable_field_field_14 > label {
  color: var(--fic-form-label) !important;
  font-family: var(--fic-font-heading) !important;
  font-size: var(--fic-type-form-label-size) !important;
  font-weight: var(--fic-type-form-label-weight) !important;
  line-height: var(--fic-type-form-label-leading) !important;
  letter-spacing: var(--fic-type-tracking) !important;
  text-transform: uppercase !important;
}
/* Keep plugin feedback visible; preserve its show/hide lifecycle. */
.fic-donation-form .charitable-notice {
  background: var(--fic-gold-pale);
  color: var(--fic-teal-deep);
  border-radius: var(--fic-radius-sm);
  padding: 14px 16px;
  font-size: var(--fic-type-support-size);
  line-height: var(--fic-type-support-leading);
}
.fic-donation-form .charitable-notice.charitable-form-errors {
  background: #ffeded;
  color: #8f2424 !important;
  border-radius: var(--fic-radius-sm);
  padding: 14px 16px;
  font-size: var(--fic-type-support-size);
  line-height: var(--fic-type-support-leading);
}
.fic-donation-form .charitable-notice.charitable-form-errors :is(ul, li) { color: #8f2424 !important; }

.fic-donation-form .donation-amount:has(input:focus-visible) label,
.fic-donation-form .charitable-form-field-recurring-donation label:has(input:focus-visible),
.fic-donation-form #charitable-gateway-selector li:has(input:focus-visible) label {
  outline: 2px solid var(--fic-gold) !important;
  outline-offset: 3px;
}

/* Display only the plugin-selected frequency; totals/fees stay plugin-owned. */
.fic-donation-form .fic-donation-frequency {
  flex-basis: 100%;
  color: var(--fic-gold-light);
  font: 400 13px/1.5 var(--fic-font-body);
}
.fic-donation-form .charitable-field-error-message,
.fic-donation-form #charitable_stripe_card_errors {
  color: #ffb4a8;
  font-size: var(--fic-type-support-size);
  line-height: var(--fic-type-support-leading);
}
.fic-donation-form .charitable-field-error {
  border-color: var(--fic-form-invalid) !important;
}

/* Reflect native plugin states on the visible tile; retain the real radios. */
.fic-donation-form .charitable-visual-donation-form .donation-amounts .donation-amount:has(input[type="radio"]:is([aria-invalid="true"], .charitable-field-error)) label,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-recurring-period-list label:has(input[type="radio"]:is([aria-invalid="true"], .charitable-field-error)),
.fic-donation-form #charitable-gateway-selector li:has(input:is([aria-invalid="true"], .charitable-field-error)) label {
  border-color: var(--fic-form-invalid) !important;
}

.fic-donation-form .charitable-visual-donation-form .donation-amounts .donation-amount:has(input[type="radio"]:disabled) label,
.fic-donation-form .charitable-form-field-recurring-donation .charitable-recurring-period-list label:has(input[type="radio"]:disabled),
.fic-donation-form #charitable-gateway-selector li:has(input:disabled) label {
  border-color: var(--fic-line-on-dark) !important;
  background: var(--fic-teal-light) !important;
  color: rgba(255, 255, 255, .72) !important;
  cursor: not-allowed;
}

/* Keep both plugin-owned lists: the Custom tile fills the sixth position at
   either column count, including the lazy-loaded session wrapper. */
@media (max-width: 480px) {
  .fic-donation-form .charitable-donation-options { --fic-amount-grid-columns: 2; }
  .fic-donation-form .charitable-multistep-button-next,
  .fic-donation-form .charitable-donate-button-submit { min-height: 56px; }
}

@media (max-width: 767px) {
  .fic-donation-form { --fic-donation-pad: 20px; }
  .fic-donation-form .charitable-multistep-header-row { padding-top: 20px; }
  .fic-donation-form .charitable-multistep-fields-container { padding-top: 22px; }
  .fic-donation-form .charitable-multistep-navigation { justify-content: stretch; }
  .fic-donation-form .charitable-multistep-button-next,
  .fic-donation-form .charitable-donate-button-submit { width: 100%; }
  .fic-donation-form .charitable-visual-donation-form .charitable-fieldset.charitable-donor-name-side-by-side .charitable-donor-name-fields-container,
  .fic-donation-form .charitable-address-compact-row,
  .fic-donation-form .fic-donation-inline-row { grid-template-columns: minmax(0, 1fr) !important; }
  .fic-donation-form .charitable-donor-name-fields-container,
  .fic-donation-form .fic-donation-inline-row { gap: 16px !important; }

  /* First-step labels/choices are compact; donor and payment fields keep their roles. */
  .fic-donation-form.fic-form--dark #charitable_field_field_14 > label,
  .fic-donation-form .fic-donate-amounts > .charitable-field-label,
  .fic-donation-form .charitable-form-field-recurring-donation legend {
    font-size: var(--fic-type-label-size) !important;
    font-weight: var(--fic-weight-bold) !important;
    line-height: 1.4;
    margin-bottom: 10px !important;
    color: rgba(255, 255, 255, .72) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fic-donation-form .charitable-donation-options.has-custom-reveal,
  .fic-donation-form .has-custom-reveal .custom-donation-input { transition: none; }
}
