.elementor-kit-214{--e-global-color-primary:#123A7A;--e-global-color-secondary:#1F4D9B;--e-global-color-text:#5F6B7A;--e-global-color-accent:#C8742A;--e-global-color-3d90fb3:#E5A86B;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"IBM Plex Sans";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"IBM Plex Sans";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto Condensed";--e-global-typography-accent-font-weight:500;}.elementor-kit-214 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================================
   ROCKY MOUNTAIN COMPOUNDS — FunnelKit Checkout Styling
   ------------------------------------------------------------
   Where to paste:
   FunnelKit → Store Checkout (or your Funnel) → Checkout step
   → Edit → Settings (gear) → Custom CSS
   (Also works in Appearance → Customize → Additional CSS)
   ============================================================ */

/* ---- 1. BRAND TOKENS — edit these, everything follows ----- */
.wfacp_main_form.woocommerce,
body.wfacp-template-page {
  --rmc-navy:        #1E2F5C;  /* deep navy — headings, bars, header    */
  --rmc-accent:      #E0913D;  /* brand orange — buttons, links, focus  */
  --rmc-accent-dark: #C2782A;  /* button hover                          */
  --rmc-accent-soft: #F2A65A;  /* orange highlight text on navy         */
  --rmc-ridge:       linear-gradient(90deg, #1E2F5C 0%, #3D5A99 55%, #E0913D 100%);
  --rmc-bg:          #F4F7FA;  /* glacier gray page background         */
  --rmc-card:        #FFFFFF;  /* card / form surfaces                 */
  --rmc-text:        #22303C;  /* body text                            */
  --rmc-text-soft:   #5C6B7A;  /* labels, helper text                  */
  --rmc-border:      #D9E1E8;  /* input & card borders                 */
  --rmc-green:       #2E7D5B;  /* trust / success accents              */
  --rmc-radius:      10px;
  --rmc-shadow:      0 6px 24px rgba(27, 47, 69, 0.08);
}

/* ---- 2. PAGE CANVAS --------------------------------------- */
body.wfacp-template-page,
body.wfacp-template-page .elementor,
body.wfacp-template-page .e-con,
.wfacp_main_wrapper {
  background: var(--rmc-bg) !important;
  color: var(--rmc-text);
}

/* ---- 3. SECTION CARDS -------------------------------------- */
/* The template already draws each section as its own box, so the
   big form wrapper stays TRANSPARENT (fixes the white slab bug). */
.wfacp_main_form .wfacp-form,
.wfacp_main_form #wfacp-e-form,
.wfacp_main_form .woocommerce-checkout {
  background: transparent !important;
  box-shadow: none !important;
}
.wfacp_main_form .wfacp-form::before { display: none; }

/* Each FunnelKit section becomes a clean brand card */
.wfacp_main_form .wfacp-section,
.wfacp_main_form .wfacp_section {
  background: var(--rmc-card);
  border-radius: var(--rmc-radius);
  box-shadow: var(--rmc-shadow);
  position: relative;
  overflow: hidden;
}

/* Signature ridge line on the FIRST section only */
.wfacp_main_form .wfacp-section:first-of-type::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--rmc-ridge);
}

/* ---- 4. SECTION HEADINGS ---------------------------------- */
.wfacp_main_form .wfacp-section-heading,
.wfacp_main_form h3,
.wfacp_main_form .wfacp_section_title {
  color: var(--rmc-navy);
  font-weight: 700;
  letter-spacing: 0.01em;
}

/* ---- 5. PROGRESS / STEP INDICATOR ------------------------- */
.wfacp_main_form .wfacp-progress-bar-nav li.active a,
.wfacp_main_form .wfacp-progress-bar-nav li.active span,
.wfacp_main_form .wfacp-progress-bar-nav li.wfacp-done a {
  color: var(--rmc-accent);
  font-weight: 600;
}
.wfacp_main_form .wfacp-progress-bar-nav li.active:after,
.wfacp_main_form .wfacp-progress-bar-nav li.wfacp-done:after {
  background: var(--rmc-accent);
}

/* ---- 6. INPUT FIELDS -------------------------------------- */
.wfacp_main_form .wfacp-form-control,
.wfacp_main_form input[type="text"],
.wfacp_main_form input[type="email"],
.wfacp_main_form input[type="tel"],
.wfacp_main_form select,
.wfacp_main_form textarea {
  border: 1.5px solid var(--rmc-border);
  border-radius: 8px;
  background: #FBFCFE;
  color: var(--rmc-text);
  min-height: 48px;                 /* comfortable tap targets on mobile */
  transition: border-color .15s ease, box-shadow .15s ease;
}
.wfacp_main_form .wfacp-form-control:focus,
.wfacp_main_form input:focus,
.wfacp_main_form select:focus,
.wfacp_main_form textarea:focus {
  border-color: var(--rmc-accent);
  box-shadow: 0 0 0 3px rgba(224, 145, 61, 0.22);
  outline: none;
  background: #FFFFFF;
}
.wfacp_main_form label,
.wfacp_main_form .wfacp-form-control-label {
  color: var(--rmc-text-soft);
  font-size: 13px;
  font-weight: 600;
}
/* Field error state */
.wfacp_main_form .woocommerce-invalid input,
.wfacp_main_form .woocommerce-invalid .wfacp-form-control {
  border-color: #C0392B;
}

/* ---- 7. PLACE ORDER / NEXT BUTTONS ------------------------ */
.wfacp_main_form #place_order,
.wfacp_main_form .wfacp_next_btn_wrap .wfacp-next-btn-proceed,
.wfacp_main_form button.wfacp_next_step_btn,
.wfacp_main_form .btn_style {
  background: var(--rmc-accent) !important;
  border: none !important;
  border-radius: 8px !important;
  color: #FFFFFF !important;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 16px 28px;
  box-shadow: 0 4px 14px rgba(224, 145, 61, 0.38);
  transition: background .15s ease, transform .1s ease;
}
.wfacp_main_form #place_order:hover,
.wfacp_main_form button.wfacp_next_step_btn:hover,
.wfacp_main_form .btn_style:hover {
  background: var(--rmc-accent-dark) !important;
  transform: translateY(-1px);
}

/* ---- 8. ORDER SUMMARY ------------------------------------- */
.wfacp_main_form .wfacp_order_summary,
.wfacp_main_form #order_review,
.wfacp_main_form .wfacp-order-summary-holder {
  background: #FBFCFE;
  border: 1px solid var(--rmc-border);
  border-radius: var(--rmc-radius);
}
.wfacp_main_form .order-total .woocommerce-Price-amount,
.wfacp_main_form .wfacp_order_summary .order-total td {
  color: var(--rmc-navy);
  font-weight: 800;
  font-size: 1.15em;
}
/* Free-shipping / discount rows in green */
.wfacp_main_form .cart-discount .woocommerce-Price-amount,
.wfacp_main_form .wfacp_coupon_applied {
  color: var(--rmc-green);
}

/* ---- 9. COUPON FIELD -------------------------------------- */
.wfacp_main_form .wfacp_coupon_apply,
.wfacp_main_form .wfacp-coupon-page-btn {
  background: var(--rmc-navy) !important;
  color: #fff !important;
  border-radius: 8px !important;
}

/* ---- 10. ORDER BUMP (FunnelKit bump box) ------------------ */
.wfacp_main_form .wfob_bump_wrapper,
.wfob_main_wrapper .wfob_bump_order_field_wrapper {
  border: 2px dashed var(--rmc-accent) !important;
  border-radius: var(--rmc-radius) !important;
  background: #FDF4E8 !important;
}
.wfob_main_wrapper .wfob_bump_order_head {
  background: var(--rmc-navy) !important;
  color: #fff !important;
}

/* ---- 11. TRUST ROW under the button ----------------------- */
/* Add an HTML/Text field below Payment in the FunnelKit builder
   with the markup from the setup guide; this styles it.        */
.rmc-trust-row {
  display: flex;
  justify-content: center;
  gap: 22px;
  flex-wrap: wrap;
  margin-top: 14px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rmc-text-soft);
}
.rmc-trust-row span::before {
  content: "✓ ";
  color: var(--rmc-green);
  font-weight: 800;
}

/* ---- 12. FREE-SHIPPING PROGRESS BAR ------------------------ */
/* Rendered by the [rmc_ship_progress] shortcode (see plugin).  */
.rmc-ship-progress {
  background: var(--rmc-navy);
  color: #fff;
  border-radius: 8px;
  padding: 11px 16px 13px;
  margin-bottom: 18px;
}
.rmc-ship-progress__msg {
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  margin-bottom: 8px;
}
.rmc-ship-progress__msg strong,
.rmc-ship-progress__msg .woocommerce-Price-amount {
  color: var(--rmc-accent-soft);
}
.rmc-ship-progress__track {
  height: 8px;
  background: rgba(255, 255, 255, 0.18);
  border-radius: 99px;
  overflow: hidden;
}
.rmc-ship-progress__fill {
  height: 100%;
  background: linear-gradient(90deg, #E0913D, #F2B36B);
  border-radius: 99px;
  transition: width .5s ease;
}
/* Goal reached: fill turns green */
.rmc-ship-progress.is-complete .rmc-ship-progress__fill {
  background: linear-gradient(90deg, #2E7D5B, #5CB98F);
}

/* ---- 12b. STATIC NUDGE BAR (fallback, no plugin) ----------- */
.rmc-ship-bar {
  background: var(--rmc-navy);
  color: #fff;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.03em;
  padding: 9px 14px;
  border-radius: 8px;
  margin-bottom: 18px;
}
.rmc-ship-bar strong { color: var(--rmc-accent-soft); }

/* ---- 13. MOBILE POLISH ------------------------------------ */
@media (max-width: 767px) {
  .wfacp_main_form .wfacp-section,
  .wfacp_main_form .wfacp_section { box-shadow: none; border: 1px solid var(--rmc-border); }
  .wfacp_main_form #place_order { width: 100%; }
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
  .wfacp_main_form * { transition: none !important; }
}
/* ==== FORCE BRAND ORANGE — overrides theme/widget button color ==== */
html body #place_order,
html body .wfacp_main_form #place_order,
html body .wfacp_main_form button[type="submit"],
html body .wfacp_main_form .wfacp_next_step_btn,
html body .wfacp_main_form .btn_style {
  background: #E0913D !important;
  background-color: #E0913D !important;
  border-color: #E0913D !important;
  color: #fff !important;
}
html body #place_order:hover,
html body .wfacp_main_form button[type="submit"]:hover {
  background: #C2782A !important;
  background-color: #C2782A !important;
}

/* Checkout links (privacy policy, terms, email) in deeper burnt orange */
html body .wfacp_main_form a {
  color: #C2782A !important;
}/* End custom CSS */